javascript - Only show columns that are filled from external JSON in ExtJS 3.x -
i parsing external json source in extjs , want display data in extjs grid. works perfectly.
there maximum set of fields predicitable, in cases of fields empty/not in json. if field not filled @ all, should not hidden.
is there functionality hide dynamically in extjs 3.x?
my code far:
var store = new ext.data.jsonstore({ url : '/data/all.json', storeid : 'mainstore', fields : ['name', 'company', 'country'] }); store.load() var columns = []; var colmodel = new ext.grid.columnmodel([ {header: 'name', sortable: true, dataindex: 'name', filterable: true, hidden: false, filter: {type: 'string'}}, {header: 'company', sortable: true, dataindex: 'company', filterable: true, hidden: false, filter: {type: 'string'}}, {header: 'country', sortable: true, dataindex: 'country', filterable: true, hidden: false, filter: {type: 'string'}}, ]);
my json like:
this should display fields.
[ {"name": "jon doe", "company": "acme inc.", "country": "mexico"}, {"name" : "jane doe", "company" : "acme ltd", "country" : "usa"}]
this should show name , company.
[ {"name": "jon doe", "company": "acme inc."}, {"name" : "jane doe", "company" : "acme ltd"}]
this should again show fields.
[ {"name": "jon doe", "company": "acme inc."}, {"name" : "jane doe", "company" : "acme ltd", "country" : "usa"}]
help appreciated.
you can create function evaluates data , return boolean.
var showorhidecolumns = function(columnname) { var records = store.getrange(), hidden = false; ext.each(records, function(itm, idx) { if (!itm.get(columnname)) { hidden = true; break; } }); return hidden; };
and use above function in headers. may want check scope of method in code.
{ header: 'name', hidden: showorhidecolumns }
note: above code not tested.
Comments
Post a Comment