OK, I admit it. I'm baffled. - Ext JS

#2 02-20-2007, 06:10 AM

Animal,

You don't need to touch DataStore. It was specifically designed to be independent of the source of the data. What you need is a DataProxy (proxy's data from sources) and a Reader (read DWR objects into data.Records). Both those interfaces are very simple. The structure was defined so that you don't need to extend Store to provide data from sources other than the default 3.

The flow is like this:

Store calls proxy passing info about what to load. Proxy gets the data from wherever and then uses a reader to read it into record objects. It then calls back to the store with the new data who then notifies observers of the new data.

It may seem overly complex, but there is a reason - trust me.

--

The record class is very different than a ColumnModel. It defines the data structure/fields, while the ColumnModel defines the column's in a grid. While much of the time they may be similar, their properties are entirely different. Records can and will be used by more than just the grid.

#3 02-20-2007, 06:17 AM

OK then, looks like I need a DWRProxy, and a DWRReader. I'll look at existing ones to see what to do. Thanks!

OK, I get it about the records - you can have loads of fields in the record, but your ColumnModel might only use a few of them.

#4 02-20-2007, 06:41 AM

What methods does my DWRProxy have to implement? I've copied HttpProxy, but obviously there can be no getConnection()

#5 02-20-2007, 07:33 AM

Currently the only one called is load(), but the other update ones will eventually be there to automatically marshall saves.

The whole Connection stuff is specific to HttpProxy so you can ignore it.

#6 02-20-2007, 07:53 AM

OK, so "name" in Ext.data.Record.create() maps a record item onto the ColumnModel's "dataIndex" property?

And "mapping" in Ext.data.Record.create() is the index into the field collection? Because through DWR, I'm just returning a row as an Object[]

So I guess "mapping" will be 0, 1, 2....?

#7 02-20-2007, 08:09 AM

So it's the "params" parameter passed to load() that specified page number and size etc?
[/code]

#8 02-20-2007, 08:51 AM

I guess. I'm not very familiar with DWR responses.

The column model (or later, form fields) can bind to fields in a record via dataIndex=>named field.

Incoming data can be mapped into fields via mapping => field. If you are using a default reader, you could skip the mapping stage, but that's up to you.

The params passed to load will contain start, limit and optionally any sorting information.

#9 02-20-2007, 10:00 AM

OK, so what I send back from the DWR call getRange(int start, int limit) is this object:

public class ListRange
{
	private long totalRows;
	private Object[] data; // Each element, is in fact an Object[]
	public ListRange() {
		this.totalRows = 0;
		this.data = new Object[]{};
	}
	public ListRange(long totalRows, Object[] data) {
		this.totalRows = totalRows;
		this.data = data;
	}
	public void setData(Object[] data) {
		this.data = data;
	}
	public Object[] getData() {
		return data;
	}
	public void setTotalRows(int totalRows) {
		this.totalRows = totalRows;
	}
	public long getTotalRows() {
		return totalRows;
	}
}

DWR marshalls that into a javascript object, so the DWRProxy looks like this:

aspicio.DWRProxy = function(listerId) {
    this.listerId = listerId;
    aspicio.DWRProxy.superclass.constructor.call(this);
};

Ext.extend(aspicio.DWRProxy, Ext.data.DataProxy, {
    load : function(params, reader, callback, scope, arg){
        if(this.fireEvent("beforeload", this, params) !== false){
			ListHelper.getRange(this.listerId, params.start, params.limit,
				this.loadResponse.createDelegate(this, [reader, callback, scope, arg], 1));
        }else{
            callback.call(scope||this, null, arg, false);
        }
    },
    
    loadResponse : function(listRange, reader, callback, scope, arg){
        var result;
        try {
            result = reader.read(listRange);
        }catch(e) {
            this.fireEvent("loadexception", this, null, response, e);
            callback.call(scope, null, arg, false);
            return;
        }
        callback.call(scope, result, arg, true);
    },
    
    update : function(dataSet){
        
    },
    
    updateResponse : function(dataSet){
        
    }
});

The reader looks like this:

aspicio.ListRangeReader = function(meta, recordType){
    Ext.data.ListRangeReader.superclass.constructor.call(this, meta, recordType);
};
Ext.extend(aspicio.ListRangeReader, Ext.data.DataReader, {
    readRecords : function(o){
        var sid = this.meta ? this.meta.id : null;
    	var recordType = this.recordType, fields = recordType.prototype.fields;
    	var records = [];
    	var root = o.data;
	    for(var i = 0; i < root.length; i++){
		    var n = root[i];
	        var values = {};
	        var id = (sid && n[sid] !== undefined && n[sid] !== "" ? n[sid] : null);
	        for(var j = 0, jlen = fields.length; j < jlen; j++){
                var f = fields.items[j];
                var k = f.mapping || j;
                var v = n[k] !== undefined ? n[k] : f.defaultValue;
                v = f.convert(v);
                values[f.name] = v;
            }
	        var record = new recordType(values, id);
	        records[records.length] = record;
	    }
	    return {
	        records : records,
	        totalRecords : o.totalRows
	    };
    }
});

which is created like this:

//	    Create reader that can read a com.aspicio.util.ListRange
	    this.reader = new aspicio.ListRangeReader({ id: 0 }, this.columnModel.dataRecord);

Because the ColumnModel knows about the data, so it creates the Ext.data.Record:

//	Create the data record which just uses numeric indices into an Object Array.
//	Do not include the uuid field which is always present as the id. All other
//	columns are valid data fields.
	var recordEls = [];
	var colIdx = 0;
    	for (var col in config) {
    		if (col.name != "uuid") { // Skip the uuid
	    		recordEls.push({name:col.dataIndex, mapping:colIdx});
	    		colIdx++;
	    	}
    	}
	this.dataRecord = Ext.data.Record.create(recordEls);

What can possibly go wrong? :lol: :lol: :lol: :lol: :lol: :lol:

#10 02-20-2007, 10:09 AM

Nothing obvious jumping out at me. Any errors?

FYI, I can't tell you how much you code has improved in the past few months. That's some clean looking code! Even your brackets are in the "right" spot.