PDA

View Full Version : Add Custom function in JSON array



KSagar
22 Dec 2009, 7:24 AM
We have created one plug-in which takes input as a form data(form structure) in json format.
following is the json format


{id:'adduser', xtype:'form',border:false,layout:'form',bodyStyle:'padding:20px',defaults:{width:250,xtype:'textfield',allowBlank:false,msgTarget:'side'},
items:[{
name:'phone',fieldLabel:'Phone'
},{
name:'mobile',fieldLabel:'Mobile'
},{
name:'data',xtype:'hidden',value:"firstname=Frederick&lastname=Huang&[email protected]"
}],
bbar: ['->',{text:'Add',handler:function(){
if (Ext.getCmp('adduser').getForm().isValid()){
Ext.getCmp('ext-comp-1002').reload({
params: {id:-1,stage:2,data:Ext.getCmp('adduser').getForm().getValues(true)}
});
}
}}]
}

With the use of doLayout(), we are rendering the form from the above json data.
Now we want to add a custom function in the json data which will gets called on click of the add button which is present on the form just rendered.
Now I am trying to call this new function in the following format


{id:'adduser', xtype:'form',border:false,layout:'form',bodyStyle:'padding:20px',defaults:{width:250,xtype:'textfield',allowBlank:false,msgTarget:'side'},
items:[{
name:'phone',fieldLabel:'Phone'
},{
name:'mobile',fieldLabel:'Mobile'
},{
name:'data',xtype:'hidden',value:"firstname=Frederick&lastname=Huang&[email protected]"
}],
bbar: ['->',{text:'Add',handler:function(){

this.Test();
}}],
Test:function(){
alert("This is the custom function.");
}

}

But above format is generating an error. Can anybody tell me how to do this?

22 Dec 2009, 7:29 AM
Your problem is this refers to the button

KSagar
22 Dec 2009, 7:43 AM
Thanks for your reply.

We have changed our code to



{id:'adduser', xtype:'form',border:false,layout:'form',bodyStyle:'padding:20px',defaults:{width:250,xtype:'textfield',allowBlank:false,msgTarget:'side'},
items:[{
name:'phone',fieldLabel:'Phone'
},{
name:'mobile',fieldLabel:'Mobile'
},{
name:'data',xtype:'hidden',value:"firstname=Frederick&lastname=Huang&[email protected]"
}],
bbar: ['->',{text:'Add',handler:function(){

Test();
}}],
Test:function(){
alert("This is the custom function.");
}

}

It is still showing error as 'object not found'.
Do we need to place this function at any specific location?

22 Dec 2009, 7:47 AM
You can do two things:
You can walk up the container heirarchy (this.findParentBy()) or you can use the static ID that you've set for that panel:

Ext.getCmp('adduser').getForm().submit();

Is there a particular reason why you're using static ids?

KSagar
22 Dec 2009, 7:56 AM
This is just a sample json data where we have hardcoded ids.

22 Dec 2009, 8:18 AM
Then your ownly option is to walk up the container heirarchy:

try this.ownerCt.ownerCt.test()

KSagar
22 Dec 2009, 8:29 AM
Thanks. I will try this option.