PDA

View Full Version : Events usage



eurobax
17 Oct 2010, 9:05 PM
Hello!
I have a one Store and few forms, which should represent data from one store.
How is it possible to refresh all forms on Store data has change? It seems to me the best idea is using Events, but i don't understand how store vs form can communicate with event.

For example:


var store = new Ext.data.JsonStore({
url: 'get-form-data.php',
root: 'data', //data.form1 - data for form1
//data.form2 - data for form2.. e.t.c.
...
listeners:{
'datachanged' : function(thisStore){ //subscribe to data change in store
//just here I should fireEvent("hey you, forms! Refresh with new data!");
//But here I don't know what forms a connected (subscribed)
}
}
});

//Make some feature in FormPanel to link to Store
myForm = Ext.extends(Ext.form.FormPanel,{
constructor: function(options){
this._store = options.store; //Store
this._dataPath = options.dataPath; //data path in store, where are values of fields
// this._store[this._dataPath] - here are values for this form
...
}
_refresh(){
//puts data from store (this._store[this._dataPath]) to form fields
..
},
})

var form1 = new MyForm({
store : store, //Link to store
dataPath : 'form1',
items : [
...fields...
]
});

var form2 = new MyForm({
store : store, //the same store!
dataPath : 'form2', //may be there also 'form1', that's the clone form with same data
items : [
...fields...
]
});

mcadirci
17 Oct 2010, 10:05 PM
Hello,

At api doc each class has public events add your store a update event

store.on('update' myFunction');
function myFunction(){
//do smt
}

eurobax
17 Oct 2010, 10:21 PM
Ok, but I've just use event 'datachanged' of JsonStore. My question is of how to tell form(s) of store data has changed.

mcadirci
17 Oct 2010, 10:32 PM
Do what ever you need on the update function. Can you be more specific?

eurobax
17 Oct 2010, 11:53 PM
Ok, store have 'update' and 'datachange' events, there is no difference in my question.
What I want to do.. is like this:


store.on('update', myFunction);
function myFunction(){
//do smt
I just want here to fire "hey, forms! refresh your data!". But I don't know this forms HERE...
How should I organize this forms and link them to store event ?
}

mcadirci
18 Oct 2010, 12:53 AM
smt like this should work:

var field1 = new Ext.TextField({
id: 'firstField',
name: 'size',
value: store.data[0].size
});
function myFunction(){
Ext.getCmp('firstField').setValue(Ext.getCmp('storeId').data[0].size);
}

eurobax
18 Oct 2010, 1:13 AM
Yes, this works.. But I don't know how many forms are there, their count may be one, may be 10, may be 0. See "I have a one Store and few forms, which should represent data from one store."

mcadirci
18 Oct 2010, 1:25 AM
Put your forms in an array and use for loop then =p

Animal
18 Oct 2010, 1:28 AM
How many forms?

Don't you just load a form with the data from one Record using



myFormPanel.getForm().loadRecord(theSelectedRecord);


?

eurobax
18 Oct 2010, 2:02 AM
Forms count is dynamic.
Yes, it is like loading form from one Record, but I use own method of feeling form (_refresh), which take data from store and calls native loadRecord().
In store I don't know how many forms it serves. It seems to me I must subscribe forms for event from store when it updates. But I can't understand how I should do it.

eurobax
18 Oct 2010, 2:03 AM
Put your forms in an array and use for loop then =p
Yeah.. I did it in such manner, but I think the best idea is using events.

laurentParis
18 Oct 2010, 4:55 AM
Look on saki binding example
(add http)://examples.extjs.eu/

select on tree:

application design /// Complex Data Binding /// run

I think that this example can helping you

eurobax
18 Oct 2010, 9:41 PM
thank's, LaurentParis, It seems like what I want..