Sencha ExtJS

ExtJs Simple Data Writer

On April 2, 2010, in JavaScript, Sencha ExtJS, by evag

Ext.data.SimpleWriter facilitates create, update, and destroy (CRUD) actions between an Ext.data.Store and a server-side framework, like it would done using a default html form, e.g. Ext.data.SimpleWriter sends request as arrays.

The simplest writer that comes to mind is a writer like form submit requests. It means that sent data would be like {field => value} as in form submition. To write a writer in ExtJs we need to extend Ext.data.DataWriter class.
It is very important what version of ExtJs you use, because the API of this class changed from v3.0 to v3.1.
For v3.0 render function was like this:

	/**
	 * abstract method meant to be overridden
	 * by all DataWriter extensions. It's the
	 * extension's job to apply the "data" to
	 * the "params". The data-object provided
	 * to render is populated with data according
	 * to the meta-info defined in the
	 * user's DataReader config
	 *
	 * @param {String} action [Ext.data.Api.actions.create|
									read|update|destroy]
	 * @param {Record[]} rs Store recordset
	 * @param {Object} params Http params to be sent to server.
	 * @param {Object} data object populated according
	 * 					to DataReader meta-data.
	*/
	render : Ext.emptyFn,

And for v3.1 render function became (BTW they hadn’t changed docs yet. I found new docs in Ext.data.JsonWriter):

	/**
	 * Final action of a write event.
	 * Apply the written data-object to params.
	 *
	 * @param {Object} http params-object to write-to.
	 * @param {Object} baseParams as defined by
	 * 					{@link Ext.data.Store#baseParams}.
	 * 					The baseParms must be encoded by
	 * 					the extending class, eg:
	 * 					{@link Ext.data.JsonWriter}.
	 * @param {Object/Object[]} data Data-object
	 * 			representing compiled Store-recordset.
	*/
	render : Ext.emptyFn,

Here is the class that I’ve written. I don’t know how well it is written but it works for me :).

Ext.namespace('Ext.data');

Ext.data.CleanWriter = Ext.extend(Ext.data.DataWriter, {

	/**
	 * Final action of a write event.
	 * Apply the written data-object to params.
	 *
	 * @param {Object} http params-object to write-to.
	 * @param {Object} baseParams as defined by
	 * 					{@link Ext.data.Store#baseParams}.
	 * 					The baseParms must be encoded by
	 * 					the extending class, eg:
	 * 					{@link Ext.data.JsonWriter}.
	 * @param {Object/Object[]} data Data-object
	 * 			representing compiled Store-recordset.
	*/
	render : function(params, baseParams, data){
		// Here params is an Object in which we need to
		// add our (key => value) pairs

		Ext.apply(params, baseParams);
		Ext.apply(params, data);
	},

	/**
	 * Adds updated resource data to params as
	 * (key => value) pairs
	 *
	 * @param {Record} rs Record to update
	 */
	update : function(rs) {
		var params = {};
		var data = this.updateRecord(rs);

		for(key in data){
			params[key] = data[key];
		}
		params[this.meta.idProperty] = rs.id;

		return params;
	},

	/**
	 * Adds newly added resource data to params
	 * as (key => value) pairs
	 *
	 * @param {Record} rs Record to write
	 */
	create : function(rs) {
		var params = {};
		var data = this.createRecord(rs);

		for(key in data){
			params[key] = data[key];
		}

		return params;
	},

	/**
	 * Adds passed resource to params for removal
	 * as idProperty => destroyRecord return value
	 * see {@link destroyRecord}
	 *
	 * @param {Record} rs Record(s) to write
	 */
	destroy : function(rs) {
		var params = {};
		params[this.meta.idProperty] = this.destroyRecord(rs);
		return params;
	},

	/**
	 * Returns data wich will be sent to server
	 * during creation
	 *
	 * @param {Ext.data.Record} rec
	 */
	createRecord : function(rec) {
		return rec.data;
	},

	/**
	 * Returns data wich will be sent to server
	 * during update
	 *
	 * @param {Ext.data.Record} rec
	 */
	updateRecord : function(rec) {
		return rec.data;
	},

	/**
	 * Returns data wich will be sent to server
	 * during removal
	 *
	 * @param {Ext.data.Record} rec
	 */
	destroyRecord : function(rec) {
		return {id: rec.id};
	}
});
 
blog comments powered by Disqus
Comments
|
Tagged with: