extjs - Loading store dynamically based on visible page data for Ext.grid.Panel column -


below renderer ext.grid.panel column. suppose contactstore has 2,000 values in , care name of record based on id (value parameter in case), , grid has 25 rows/records in page i'm on. how can dynamically store grab relevant associated records (based on foreign key) of id of grid column, rather loading 2,000 records? there way load store , in callback, somehow have "renderer" function display values after callback succeeded?

columns: [{ 

...

}, {     header: 'contact name',     flex: 1,     sortable: true,     dataindex: 'contact_id',             renderer: function(value) {         var contactstore = ext.storemanager.lookup('contacts');         return contactstore.getbyid(value).get('full_name');     } }, { 

you can adjust collectdata(records, startindex) in viewconfig that:

ext.create('ext.grid.panel', {     (...)     viewconfig: {         //this method needs adjusted         collectdata: function(records, startindex) {             var me = this;             //we can use custom function             if (me.onbeforecollectdata) {                 me.onbeforecollectdata(records);             }                         var data = me.superclass.collectdata.call(me, records, startindex);             return data;         },          onbeforecollectdata: function(records) {             var newextraparams = [];             var oldextraparams;             var needtoloadstore = false;             var contactstore = ext.storemanager.lookup('contacts');                       if (contactstore) {                 oldextraparams = contactstore.oldextraparams;             } else {                 //don't use autload: true, local store                 contactstore = ext.create('ext.data.store', {                     storeid:'contacts',                     (...)                                    });                 needtoloadstore = true;             }              (var x in records) {                 //contact_id read out here                 var param = records[x].get('contact_id');                 if (param) {                     if (needtoloadstore == false && ext.array.contains(oldextraparams, param) == false) {                         needtoloadstore = true;                     }                     newextraparams.push(param);                 }                             }                         if (needtoloadstore == true) {                 //we use load store data => because of async: false property                 ext.ajax.request({                     scope: this,                     //this synchronous calls                     async: false,                     url: (...),                     method: (...),                     params: newextraparams,                     success: function (res, opt) {                         var responseobj = ext.decode(res.responsetext, false);                         contactstore.loaddata(responseobj); //or deeper in responseobj if needed                         contactstore.oldextraparams = newextraparams;                     }                 });             }         }     } });

Comments

Popular posts from this blog

html - How to style widget with post count different than without post count -

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

javascript - storing input from prompt in array and displaying the array -