paramOrder: ['param1','param2','param3']
paramOrder: 'param1 param2 param3'
paramOrder: 'param1,param2,param3'
paramOrder: 'param1|param2|param'
A function to be called after the request. * The callback is passed the following arguments:
this reference) in which the callback function is executed. Defaults to the browser window.
* @param {Object} arg An optional argument which is passed to the callback as its second parameter.
* @protected
*/
doRequest : function(action, rs, params, reader, callback, scope, options) {
var args = [],
directFn = this.api[action] || this.directFn;
switch (action) {
case Ext.data.Api.actions.create:
args.push(params.jsonData); // <-- create(Hash)
break;
case Ext.data.Api.actions.read:
// If the method has no parameters, ignore the paramOrder/paramsAsHash.
if(directFn.directCfg.method.len > 0){
if(this.paramOrder){
for(var i = 0, len = this.paramOrder.length; i < len; i++){
args.push(params[this.paramOrder[i]]);
}
}else if(this.paramsAsHash){
args.push(params);
}
}
break;
case Ext.data.Api.actions.update:
args.push(params.jsonData); // <-- update(Hash/Hash[])
break;
case Ext.data.Api.actions.destroy:
args.push(params.jsonData); // <-- destroy(Int/Int[])
break;
}
var trans = {
params : params || {},
request: {
callback : callback,
scope : scope,
arg : options
},
reader: reader
};
args.push(this.createCallback(action, rs, trans), this);
directFn.apply(window, args);
},
// private
createCallback : function(action, rs, trans) {
var me = this;
return function(result, res) {
if (!res.status) {
// @deprecated fire loadexception
if (action === Ext.data.Api.actions.read) {
me.fireEvent("loadexception", me, trans, res, null);
}
me.fireEvent('exception', me, 'remote', action, trans, res, null);
trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
return;
}
if (action === Ext.data.Api.actions.read) {
me.onRead(action, trans, result, res);
} else {
me.onWrite(action, trans, result, res, rs);
}
};
},
/**
* Callback for read actions
* @param {String} action [Ext.data.Api.actions.create|read|update|destroy]
* @param {Object} trans The request transaction object
* @param {Object} result Data object picked out of the server-response.
* @param {Object} res The server response
* @protected
*/
onRead : function(action, trans, result, res) {
var records;
try {
records = trans.reader.readRecords(result);
}
catch (ex) {
// @deprecated: Fire old loadexception for backwards-compat.
this.fireEvent("loadexception", this, trans, res, ex);
this.fireEvent('exception', this, 'response', action, trans, res, ex);
trans.request.callback.call(trans.request.scope, null, trans.request.arg, false);
return;
}
this.fireEvent("load", this, res, trans.request.arg);
trans.request.callback.call(trans.request.scope, records, trans.request.arg, true);
},
/**
* Callback for write actions
* @param {String} action [{@link Ext.data.Api#actions create|read|update|destroy}]
* @param {Object} trans The request transaction object
* @param {Object} result Data object picked out of the server-response.
* @param {Object} res The server response
* @param {Ext.data.Record/[Ext.data.Record]} rs The Store resultset associated with the action.
* @protected
*/
onWrite : function(action, trans, result, res, rs) {
var data = trans.reader.extractData(trans.reader.getRoot(result), false);
var success = trans.reader.getSuccess(result);
success = (success !== false);
if (success){
this.fireEvent("write", this, action, data, res, rs, trans.request.arg);
}else{
this.fireEvent('exception', this, 'remote', action, trans, result, rs);
}
trans.request.callback.call(trans.request.scope, data, res, success);
}
});
/**
* @class Ext.data.DirectStore
* @extends Ext.data.Store
* Small helper class to create an {@link Ext.data.Store} configured with an * {@link Ext.data.DirectProxy} and {@link Ext.data.JsonReader} to make interacting * with an {@link Ext.Direct} Server-side {@link Ext.direct.Provider Provider} easier. * To create a different proxy/reader combination create a basic {@link Ext.data.Store} * configured as needed.
* **Note: Although they are not listed, this class inherits all of the config options of:
*Overview
* *Ext.Direct aims to streamline communication between the client and server * by providing a single interface that reduces the amount of common code * typically required to validate data and handle returned data packets * (reading data, error conditions, etc).
* *The Ext.direct namespace includes several classes for a closer integration * with the server-side. The Ext.data namespace also includes classes for working * with Ext.data.Stores which are backed by data from an Ext.Direct method.
* *Specification
* *For additional information consult the * Ext.Direct Specification.
* *Providers
* *Ext.Direct uses a provider architecture, where one or more providers are * used to transport data to and from the server. There are several providers * that exist in the core at the moment:
A provider does not need to be invoked directly, providers are added via * {@link Ext.Direct}.{@link Ext.Direct#add add}.
* *Router
* *Ext.Direct utilizes a "router" on the server to direct requests from the client * to the appropriate server-side method. Because the Ext.Direct API is completely * platform-agnostic, you could completely swap out a Java based server solution * and replace it with one that uses C# without changing the client side JavaScript * at all.
* *Server side events
* *Custom events from the server may be handled by the client by adding * listeners, for example:
*
{"type":"event","name":"message","data":"Successfully polled at: 11:19:30 am"}
// add a handler for a 'message' event sent by the server
Ext.Direct.on('message', function(e){
out.append(String.format('<p><i>{0}</i></p>', e.data));
out.el.scrollTo('t', 100000, true);
});
*
var pollProv = new Ext.direct.PollingProvider({
url: 'php/poll2.php'
});
Ext.Direct.addProvider(
{
"type":"remoting", // create a {@link Ext.direct.RemotingProvider}
"url":"php\/router.php", // url to connect to the Ext.Direct server-side router.
"actions":{ // each property within the actions object represents a Class
"TestAction":[ // array of methods within each server side Class
{
"name":"doEcho", // name of method
"len":1
},{
"name":"multiply",
"len":1
},{
"name":"doForm",
"formHandler":true, // handle form on server with Ext.Direct.Transaction
"len":1
}]
},
"namespace":"myApplication",// namespace to create the Remoting Provider in
},{
type: 'polling', // create a {@link Ext.direct.PollingProvider}
url: 'php/poll.php'
},
pollProv // reference to previously created instance
);
* Supporting Class for Ext.Direct (not intended to be used directly).
* @constructor * @param {Object} config */ Ext.Direct.Transaction = function(config){ Ext.apply(this, config); this.tid = ++Ext.Direct.TID; this.retryCount = 0; }; Ext.Direct.Transaction.prototype = { send: function(){ this.provider.queueTransaction(this); }, retry: function(){ this.retryCount++; this.send(); }, getProvider: function(){ return this.provider; } };Ext.Direct.Event = function(config){ Ext.apply(this, config); }; Ext.Direct.Event.prototype = { status: true, getData: function(){ return this.data; } }; Ext.Direct.RemotingEvent = Ext.extend(Ext.Direct.Event, { type: 'rpc', getTransaction: function(){ return this.transaction || Ext.Direct.getTransaction(this.tid); } }); Ext.Direct.ExceptionEvent = Ext.extend(Ext.Direct.RemotingEvent, { status: false, type: 'exception' }); Ext.Direct.eventTypes = { 'rpc': Ext.Direct.RemotingEvent, 'event': Ext.Direct.Event, 'exception': Ext.Direct.ExceptionEvent }; /** * @class Ext.direct.Provider * @extends Ext.util.Observable *Ext.direct.Provider is an abstract class meant to be extended.
* *For example ExtJs implements the following subclasses:
*
Provider
|
+---{@link Ext.direct.JsonProvider JsonProvider}
|
+---{@link Ext.direct.PollingProvider PollingProvider}
|
+---{@link Ext.direct.RemotingProvider RemotingProvider}
*
Ext.Direct.addProvider(
{
type: 'polling',
url: 'php/poll.php',
id: 'poll-provider'
}
);
var p = {@link Ext.Direct Ext.Direct}.{@link Ext.Direct#getProvider getProvider}('poll-provider');
p.disconnect();
* Provides for repetitive polling of the server at distinct {@link #interval intervals}. * The initial request for data originates from the client, and then is responded to by the * server.
* *All configurations for the PollingProvider should be generated by the server-side * API portion of the Ext.Direct stack.
* *An instance of PollingProvider may be created directly via the new keyword or by simply * specifying type = 'polling'. For example:
*
var pollA = new Ext.direct.PollingProvider({
type:'polling',
url: 'php/pollA.php',
});
Ext.Direct.addProvider(pollA);
pollA.disconnect();
Ext.Direct.addProvider(
{
type:'polling',
url: 'php/pollB.php',
id: 'pollB-provider'
}
);
var pollB = Ext.Direct.getProvider('pollB-provider');
* The {@link Ext.direct.RemotingProvider RemotingProvider} exposes access to * server side methods on the client (a remote procedure call (RPC) type of * connection where the client can initiate a procedure on the server).
* *This allows for code to be organized in a fashion that is maintainable, * while providing a clear path between client and server, something that is * not always apparent when using URLs.
* *To accomplish this the server-side needs to describe what classes and methods * are available on the client-side. This configuration will typically be * outputted by the server-side Ext.Direct stack when the API description is built.
*/ Ext.direct.RemotingProvider = Ext.extend(Ext.direct.JsonProvider, { /** * @cfg {Object} actions * Object literal defining the server side actions and methods. For example, if * the Provider is configured with: *
"actions":{ // each property within the 'actions' object represents a server side Class
"TestAction":[ // array of methods within each server side Class to be
{ // stubbed out on client
"name":"doEcho",
"len":1
},{
"name":"multiply",// name of method
"len":2 // The number of parameters that will be used to create an
// array of data to send to the server side function.
// Ensure the server sends back a Number, not a String.
},{
"name":"doForm",
"formHandler":true, // direct the client to use specialized form handling method
"len":1
}]
}
* Note that a Store is not required, a server method can be called at any time. * In the following example a client side handler is used to call the * server side method "multiply" in the server-side "TestAction" Class:
*
TestAction.multiply(
2, 4, // pass two arguments to server, so specify len=2
// callback function after the server is called
// result: the result returned by the server
// e: Ext.Direct.RemotingEvent object
function(result, e){
var t = e.getTransaction();
var action = t.action; // server side Class called
var method = t.method; // server side method called
if(e.status){
var answer = Ext.encode(result); // 8
}else{
var msg = e.message; // failure message
}
}
);
* true or false to enable or disable combining of method * calls. If a number is specified this is the amount of time in milliseconds * to wait before sending a batched request (defaults to 10).
*Calls which are received within the specified timeframe will be * concatenated together and sent in a single request, optimizing the * application by reducing the amount of round trips that have to be made * to the server.
*/ enableBuffer: 10, /** * @cfg {Number} maxRetries * Number of times to re-attempt delivery on failure of a call. Defaults to 1. */ maxRetries: 1, /** * @cfg {Number} timeout * The timeout to use for each request. Defaults to undefined. */ timeout: undefined, constructor : function(config){ Ext.direct.RemotingProvider.superclass.constructor.call(this, config); this.addEvents( /** * @event beforecall * Fires immediately before the client-side sends off the RPC call. * By returning false from an event handler you can prevent the call from * executing. * @param {Ext.direct.RemotingProvider} provider * @param {Ext.Direct.Transaction} transaction * @param {Object} meta The meta data */ 'beforecall', /** * @event call * Fires immediately after the request to the server-side is sent. This does * NOT fire after the response has come back from the call. * @param {Ext.direct.RemotingProvider} provider * @param {Ext.Direct.Transaction} transaction * @param {Object} meta The meta data */ 'call' ); this.namespace = (Ext.isString(this.namespace)) ? Ext.ns(this.namespace) : this.namespace || window; this.transactions = {}; this.callBuffer = []; }, // private initAPI : function(){ var o = this.actions; for(var c in o){ var cls = this.namespace[c] || (this.namespace[c] = {}), ms = o[c]; for(var i = 0, len = ms.length; i < len; i++){ var m = ms[i]; cls[m.name] = this.createMethod(c, m); } } }, // inherited isConnected: function(){ return !!this.connected; }, connect: function(){ if(this.url){ this.initAPI(); this.connected = true; this.fireEvent('connect', this); }else if(!this.url){ throw 'Error initializing RemotingProvider, no url configured.'; } }, disconnect: function(){ if(this.connected){ this.connected = false; this.fireEvent('disconnect', this); } }, onData: function(opt, success, xhr){ if(success){ var events = this.getEvents(xhr); for(var i = 0, len = events.length; i < len; i++){ var e = events[i], t = this.getTransaction(e); this.fireEvent('data', this, e); if(t){ this.doCallback(t, e, true); Ext.Direct.removeTransaction(t); } } }else{ var ts = [].concat(opt.ts); for(var i = 0, len = ts.length; i < len; i++){ var t = this.getTransaction(ts[i]); if(t && t.retryCount < this.maxRetries){ t.retry(); }else{ var e = new Ext.Direct.ExceptionEvent({ data: e, transaction: t, code: Ext.Direct.exceptions.TRANSPORT, message: 'Unable to connect to the server.', xhr: xhr }); this.fireEvent('data', this, e); if(t){ this.doCallback(t, e, false); Ext.Direct.removeTransaction(t); } } } } }, getCallData: function(t){ return { action: t.action, method: t.method, data: t.data, type: 'rpc', tid: t.tid }; }, doSend : function(data){ var o = { url: this.url, callback: this.onData, scope: this, ts: data, timeout: this.timeout }, callData; if(Ext.isArray(data)){ callData = []; for(var i = 0, len = data.length; i < len; i++){ callData.push(this.getCallData(data[i])); } }else{ callData = this.getCallData(data); } if(this.enableUrlEncode){ var params = {}; params[Ext.isString(this.enableUrlEncode) ? this.enableUrlEncode : 'data'] = Ext.encode(callData); o.params = params; }else{ o.jsonData = callData; } Ext.Ajax.request(o); }, combineAndSend : function(){ var len = this.callBuffer.length; if(len > 0){ this.doSend(len == 1 ? this.callBuffer[0] : this.callBuffer); this.callBuffer = []; } }, queueTransaction: function(t){ if(t.form){ this.processForm(t); return; } this.callBuffer.push(t); if(this.enableBuffer){ if(!this.callTask){ this.callTask = new Ext.util.DelayedTask(this.combineAndSend, this); } this.callTask.delay(Ext.isNumber(this.enableBuffer) ? this.enableBuffer : 10); }else{ this.combineAndSend(); } }, doCall : function(c, m, args){ var data = null, hs = args[m.len], scope = args[m.len+1]; if(m.len !== 0){ data = args.slice(0, m.len); } var t = new Ext.Direct.Transaction({ provider: this, args: args, action: c, method: m.name, data: data, cb: scope && Ext.isFunction(hs) ? hs.createDelegate(scope) : hs }); if(this.fireEvent('beforecall', this, t, m) !== false){ Ext.Direct.addTransaction(t); this.queueTransaction(t); this.fireEvent('call', this, t, m); } }, doForm : function(c, m, form, callback, scope){ var t = new Ext.Direct.Transaction({ provider: this, action: c, method: m.name, args:[form, callback, scope], cb: scope && Ext.isFunction(callback) ? callback.createDelegate(scope) : callback, isForm: true }); if(this.fireEvent('beforecall', this, t, m) !== false){ Ext.Direct.addTransaction(t); var isUpload = String(form.getAttribute("enctype")).toLowerCase() == 'multipart/form-data', params = { extTID: t.tid, extAction: c, extMethod: m.name, extType: 'rpc', extUpload: String(isUpload) }; // change made from typeof callback check to callback.params // to support addl param passing in DirectSubmit EAC 6/2 Ext.apply(t, { form: Ext.getDom(form), isUpload: isUpload, params: callback && Ext.isObject(callback.params) ? Ext.apply(params, callback.params) : params }); this.fireEvent('call', this, t, m); this.processForm(t); } }, processForm: function(t){ Ext.Ajax.request({ url: this.url, params: t.params, callback: this.onData, scope: this, form: t.form, isUpload: t.isUpload, ts: t }); }, createMethod : function(c, m){ var f; if(!m.formHandler){ f = function(){ this.doCall(c, m, Array.prototype.slice.call(arguments, 0)); }.createDelegate(this); }else{ f = function(form, callback, scope){ this.doForm(c, m, form, callback, scope); }.createDelegate(this); } f.directCfg = { action: c, method: m }; return f; }, getTransaction: function(opt){ return opt && opt.tid ? Ext.Direct.getTransaction(opt.tid) : null; }, doCallback: function(t, e){ var fn = e.status ? 'success' : 'failure'; if(t && t.cb){ var hs = t.cb, result = Ext.isDefined(e.result) ? e.result : e.data; if(Ext.isFunction(hs)){ hs(result, e); } else{ Ext.callback(hs[fn], hs.scope, [result, e]); Ext.callback(hs.callback, hs.scope, [result, e]); } } } }); Ext.Direct.PROVIDERS['remoting'] = Ext.direct.RemotingProvider;