1. #11
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    6
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    Have you been to the Grid FAQ to do the usual debugging? It's the first item in the FAQ...adding loadexception listeners, etc.

  2. #12
    Ext User
    Join Date
    Oct 2008
    Posts
    78
    Vote Rating
    0
    nick saint is on a distinguished road

      0  

    Default


    Thank you,
    I have studied that source. Followed every piece of advise but still cannot get it working

  3. #13
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    6
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    Well, if you want help from the forum, you need to do the things suggested and then come back here and say what you did and what the result was.

    So you added a load and loadexception listener. What was the result? Which one fired?

    What does firebug console show? Presumably nothing since you're loading local data, but just checking.

    etc.....

  4. #14
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    6
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    Also post your code relevant at the point you're making changes. Suggestions are being made and you haven't posted your code so I don't know what your code currently looks like. Originally you directly created the grid, then you may have extended the grid also.

    Make sure your grid works without your custom store/reader/etc, there's no reason that basic example shouldn't work without your custom stuff first.

  5. #15
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    The DynamicColumnModel expects the store to be loaded when it is created.

    I modified the code a bit to avoid this restriction:
    Code:
    Ext.data.DynamicJsonReader = function(config){
    	Ext.data.DynamicJsonReader.superclass.constructor.call(this, config, []);
    };
    Ext.extend(Ext.data.DynamicJsonReader, Ext.data.JsonReader, {
    	readRecords : function(o){
    		this.jsonData = o;
    		if(o.metaData){
    			delete this.ef;
    			this.meta = o.metaData;
    			this.recordType = Ext.data.Record.create(o.metaData.fields);
    			this.onMetaChange(this.meta, this.recordType, o);
    		} else {
    			var data = this.meta.root ? this.getJsonAccessor(this.meta.root)(o) : o;
    			if (Ext.isArray(data) && data[0]) {
    				delete this.ef;
    				var fields = [];
    				for (var fieldName in data[0]) {
    					fields.push(fieldName);
    				}
    				this.meta.fields = fields;
    				this.recordType = Ext.data.Record.create(fields);
    				this.onMetaChange(this.meta, this.recordType, o);
    			}
    		}
    		var s = this.meta, Record = this.recordType,
    			f = Record.prototype.fields, fi = f.items, fl = f.length;
    		if (!this.ef) {
    			if(s.totalProperty) {
    				this.getTotal = this.getJsonAccessor(s.totalProperty);
    			}
    			if(s.successProperty) {
    				this.getSuccess = this.getJsonAccessor(s.successProperty);
    			}
    			this.getRoot = s.root ? this.getJsonAccessor(s.root) : function(p){return p;};
    			if (s.id) {
    				var g = this.getJsonAccessor(s.id);
    				this.getId = function(rec) {
    					var r = g(rec);
    					return (r === undefined || r === "") ? null : r;
    				};
    			} else {
    				this.getId = function(){return null;};
    			}
    			this.ef = [];
    			for(var i = 0; i < fl; i++){
    				f = fi[i];
    				var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
    				this.ef[i] = this.getJsonAccessor(map);
    			}
    		}
    		var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
    		if(s.totalProperty){
    			var v = parseInt(this.getTotal(o), 10);
    			if(!isNaN(v)){
    				totalRecords = v;
    			}
    		}
    		if(s.successProperty){
    			var v = this.getSuccess(o);
    			if(v === false || v === 'false'){
    				success = false;
    			}
    		}
    		var records = [];
    		for(var i = 0; i < c; i++){
    			var n = root[i];
    			var values = {};
    			var id = this.getId(n);
    			for(var j = 0; j < fl; j++){
    				f = fi[j];
    				var v = this.ef[j](n);
    				values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, n);
    			}
    			var record = new Record(values, id);
    			record.json = n;
    			records[i] = record;
    		}
    		return {
    			success : success,
    			records : records,
    			totalRecords : totalRecords
    		};
    	}
    });
    Ext.grid.DynamicColumnModel = function(store, config){
    	Ext.grid.DynamicColumnModel.superclass.constructor.call(this, Ext.apply({store: store, columns: []}, config));
    	if (store.fields) {
    		this.reconfigure();
    	}
    	store.on('load', this.reconfigure, this);
    };
    Ext.extend(Ext.grid.DynamicColumnModel, Ext.grid.ColumnModel, {
    	reconfigure: function(){
    		var cols = [];
    		this.store.fields.each(function(field){
    			cols.push({header: field.name, dataIndex: field.name});
    		});
    		this.setConfig(cols);
    	}
    });
    with:
    Code:
    var ds = new Ext.data.Store({
    	proxy: new Ext.data.HttpProxy({url: 'http://localhost/gridlink.php'}),
    	reader: new Ext.data.DynamicJsonReader({root: 'data'})
    	remoteSort: true
    });
    ds.load();
    var mygrid = new Ext.grid.EditorGridPanel({
    	//title: 'test',
    	//id: 'test',
    	width: 600,
    	height: 200,
    	ds: ds,
    	cm: new Ext.grid.DynamicColumnModel(ds),
    	selModel: new Ext.grid.RowSelectionModel({singleSelect:true}),
    	//enableColLock: true,
    	renderTo: Ext.getBody()
    });

  6. #16
    Ext User
    Join Date
    Oct 2008
    Posts
    78
    Vote Rating
    0
    nick saint is on a distinguished road

      0  

    Default


    I know you hear this pretty often but still I would like to thank you Condor. Honestly I would not have done this working, not yet. I will study more closely the code you have posted to get to know it works. Thank you.

  7. #17
    Ext User
    Join Date
    Jun 2009
    Posts
    6
    Vote Rating
    0
    el_crespo is on a distinguished road

      0  

    Default thanks

    thanks


    thanks a lot for share, this is very useful for me.

  8. #18
    Sencha User
    Join Date
    Dec 2010
    Posts
    11
    Vote Rating
    0
    joec2000 is on a distinguished road

      0  

    Default


    If anyone is looking for an ExtJS 3.x version, Condor's code seemed to work with VERY minor tweaking. I haven't fully tested it, but it seems to work so far. Thanks again, Condor!!

    Code:
    Ext.data.DynamicJsonReader = function(config){
        Ext.data.DynamicJsonReader.superclass.constructor.call(this, config, []);
    };
    Ext.extend(Ext.data.DynamicJsonReader, Ext.data.JsonReader, {
        readRecords : function(o){
            this.jsonData = o;
            if(o.metaData){
                delete this.ef;
                this.meta = o.metaData;
                this.recordType = Ext.data.Record.create(o.metaData.fields);
                this.onMetaChange(this.meta, this.recordType, o);
            } else {
                var data = this.meta.root ? this.createAccessor(this.meta.root)(o) : o;
                if (Ext.isArray(data) && data[0]) {
                    delete this.ef;
                    var fields = [];
                    for (var fieldName in data[0]) {
                        fields.push(fieldName);
                    }
                    this.meta.fields = fields;
                    this.recordType = Ext.data.Record.create(fields);
                    this.onMetaChange(this.meta, this.recordType, o);
                }
            }
            var s = this.meta, Record = this.recordType,
                f = Record.prototype.fields, fi = f.items, fl = f.length;
            if (!this.ef) {
                if(s.totalProperty) {
                    this.getTotal = this.getJsonAccessor(s.totalProperty);
                }
                if(s.successProperty) {
                    this.getSuccess = this.getJsonAccessor(s.successProperty);
                }
                this.getRoot = s.root ? this.getJsonAccessor(s.root) : function(p){return p;};
                if (s.id) {
                    var g = this.getJsonAccessor(s.id);
                    this.getId = function(rec) {
                        var r = g(rec);
                        return (r === undefined || r === "") ? null : r;
                    };
                } else {
                    this.getId = function(){return null;};
                }
                this.ef = [];
                for(var i = 0; i < fl; i++){
                    f = fi[i];
                    var map = (f.mapping !== undefined && f.mapping !== null) ? f.mapping : f.name;
                    this.ef[i] = this.getJsonAccessor(map);
                }
            }
            var root = this.getRoot(o), c = root.length, totalRecords = c, success = true;
            if(s.totalProperty){
                var v = parseInt(this.getTotal(o), 10);
                if(!isNaN(v)){
                    totalRecords = v;
                }
            }
            if(s.successProperty){
                var v = this.getSuccess(o);
                if(v === false || v === 'false'){
                    success = false;
                }
            }
            var records = [];
            for(var i = 0; i < c; i++){
                var n = root[i];
                var values = {};
                var id = this.getId(n);
                for(var j = 0; j < fl; j++){
                    f = fi[j];
                    var v = this.ef[j](n);
                    values[f.name] = f.convert((v !== undefined) ? v : f.defaultValue, n);
                }
                var record = new Record(values, id);
                record.json = n;
                records[i] = record;
            }
            return {
                success : success,
                records : records,
                totalRecords : totalRecords
            };
        }
    });
    Ext.grid.DynamicColumnModel = function(store, config){
        Ext.grid.DynamicColumnModel.superclass.constructor.call(this, Ext.apply({store: store, columns: []}, config));
        if (store.fields) {
            this.reconfigure();
        }
        store.on('load', this.reconfigure, this);
    };
    Ext.extend(Ext.grid.DynamicColumnModel, Ext.grid.ColumnModel, {
        reconfigure: function(){
            var cols = [];
            this.store.fields.each(function(field){
                cols.push({header: field.name, dataIndex: field.name});
            });
            this.setConfig(cols);
        }
    });

  9. #19
    Sencha User
    Join Date
    Dec 2011
    Posts
    10
    Vote Rating
    0
    gacek is on a distinguished road

      0  

    Default


    Hi guys,

    I tried your solution. Created DynamicJsonReader etc. but I have one problem: when I extend JsonReader, "readRecords" method is not overriden. I do override the constructor (I checked with Firebut and the breakpoint there works) but the code in "readRecords" method is never used.

    I work with extJS 3.2 and my grid, store and DynamicJsonReader looks exactly like yours.
    Can you tell me what might be the problem?

    Best regards,
    Lukasz

  10. #20
    Sencha User
    Join Date
    Jul 2012
    Posts
    1
    Vote Rating
    0
    vishalzanzrukia is on a distinguished road

      0  

    Default ExtJS 4.0.7

    ExtJS 4.0.7


    Can anyone help me for same thing for extjs 4.0.7. ?

    Thank you in advance.