PDA

View Full Version : Clearing and Reusing a Form Panel?



stevebaynet
17 Jul 2010, 3:25 PM
Ok, i have hacked my way around ExtJS in the past but google and the forum search function are just not aiding me with this. I'm sure the answer is obvious but i'm still at a loss. Any help or suggestions would be appreciated.

I have a grid, when you select a row and click edit, a window pops up with a form panel, the record is loaded into the form panel, and when you click save, it updates the database record and reloads the datastore attached to the grid.

The window object, as well as the form object are declared first and then used above.

All is well.

However, now i wanna use the same form panel to pop up when i click an add button to create a new record. However, when i click the add button and bring up the form panel, it is already filled out with the previous data that i edited before.

Searches in the forum and google on how to clear a form didnt give me much, i found a function that you can use as a plugin that adds a "clear" function, but once i use that, all the fields come up red with failed validations.

What is the best way to do this?

Here is some snippets of my code:



var editaddpanel = new Ext.FormPanel({
labelWidth:80,
url:'update.php',
id: 'customer-form',
frame:true,
title:'edit/add',
defaultType:'textfield',
monitorValid:true,
....
Just the beginning, and then i use the form in this window:



var win = new Ext.Window({
layout:'fit',
width:550,
height:380,
closable: false,
resizable: false,
plain: true,
border: false,
items: [editaddpanel]
});
So what is the best way to reuse a form panel object? or clear a form? or am i going about this wrong.

Animal
17 Jul 2010, 11:50 PM
Call its reset() method?

stevebaynet
19 Jul 2010, 3:58 PM
Call its reset() method?

unfortunately, that just resets it back to when it was first loaded with data, it does not seem to clear it.

phuang3
21 Jul 2010, 5:11 PM
I have same problem. I can only clear it by loading an empty record with form.loadRecord(). If there is better way to do this, please post it. Here is my solution:

First, defined a record.


var CustomerRecord=Ext.data.Record.create([
{name:'customerUuid',type:'string'},
{name:'id',type:'string'},
{name:'name',type:'string'},
{name:'address',type:'string'},
{name:'zip',type:'string'},
{name:'tel',type:'string'},
{name:'cell',type:'string'},
{name:'paid',type:'int'},
{name:'bonus',type:'int'}
]);




Clear the form by Form.loadRecord()


...
MyForm.getForm().loadRecord(new CustomerRecord({customerUuid:null,id:null,name:null,address:null,zip:null,tel:null,cell:null,paid:null,bonus:null}));

whippersnapper
17 Aug 2010, 5:41 AM
I'm probably preaching the chore by now. Has anyone found the official solution for this? We have a widget where the requirements supports both Reset (resets to the old preloaded settings) and Clear (wiping out all the values within the form).

Adding a dummy record to the form won't work in our workflow b/c it will erase the preloaded settings. That and it sounds like a hack...

Thanks.

Animal
17 Aug 2010, 5:42 AM
If you want to set all values to "", loop through the fields calling setValue

whippersnapper
17 Aug 2010, 5:45 AM
Thanks, Animal. I had that as one of the solution. I guess I was looking to see if Ext supported such function within their API. I guess not... I wonder why...

Animal
17 Aug 2010, 5:47 AM
They can't put in everything every person might want to do. The library would be the size of the universe.