For up to date documentation and features, visit http://docs.sencha.com/ext-js/4-0

Sencha Documentation

Hierarchy

Ext.Base
Ext.form.action.Action
Ext.form.action.Load

A class which handles loading of data from a server into the Fields of an Ext.form.Basic.

Instances of this class are only created by a Form when loading.

Response Packet Criteria

A response packet must contain:

  • success property : Boolean
  • data property : Object
  • The data property contains the values of Fields to load. The individual value object for each Field is passed to the Field's setValue method.

JSON Packets

By default, response packets are assumed to be JSON, so for the following form load call:

var myFormPanel = new Ext.form.Panel({
    title: 'Client and routing info',
    items: [{
        fieldLabel: 'Client',
        name: 'clientName'
    }, {
        fieldLabel: 'Port of loading',
        name: 'portOfLoading'
    }, {
        fieldLabel: 'Port of discharge',
        name: 'portOfDischarge'
    }]
});
myFormPanel.getForm().load({
    url: '/getRoutingInfo.php',
    params: {
        consignmentRef: myConsignmentRef
    },
    failure: function(form, action) {
        Ext.Msg.alert("Load failed", action.result.errorMessage);
    }
});
a success response packet may look like this:

{
    success: true,
    data: {
        clientName: "Fred. Olsen Lines",
        portOfLoading: "FXT",
        portOfDischarge: "OSL"
    }
}
while a failure response packet may look like this:

{
    success: false,
    errorMessage: "Consignment reference not found"
}

Other data may be placed into the response for processing the Form's callback or event handler methods. The object decoded from this JSON is available in the result property.

Defined By

Config Options

Other Configs

 
The function to call when a failure packet was received, or when an error ocurred in the Ajax communication. The func...

The function to call when a failure packet was received, or when an error ocurred in the Ajax communication. The function is passed the following parameters:

  • form : Ext.form.Basic
    The form that requested the action
  • action : Ext.form.action.Action
    The Action class. If an Ajax error ocurred, the failure type will be in failureType. The result property of this object may be examined to perform custom postprocessing.

 

The BasicForm instance that is invoking this Action. Required.

The BasicForm instance that is invoking this Action. Required.

 

Extra headers to be sent in the AJAX request for submit and load actions. See Ext.data.Connection.headers.

Extra headers to be sent in the AJAX request for submit and load actions. See Ext.data.Connection.headers.

 

The HTTP method to use to access the requested URL. Defaults to the BasicForm's method, or 'POST' if not specified.

The HTTP method to use to access the requested URL. Defaults to the BasicForm's method, or 'POST' if not specified.

 
Extra parameter values to pass. These are added to the Form's Ext.form.Basic.baseParams and passed to the specified U...

Extra parameter values to pass. These are added to the Form's Ext.form.Basic.baseParams and passed to the specified URL along with the Form's input fields.

Parameters are encoded as standard HTTP parameters using Ext.Object.toQueryString.

 
When set to true, causes the Form to be reset on Action success. If specified, this happens before the success callba...

When set to true, causes the Form to be reset on Action success. If specified, this happens before the success callback is called and before the Form's actioncomplete event fires.

 
The scope in which to call the configured success and failure callback functions (the this reference for the callback...

The scope in which to call the configured success and failure callback functions (the this reference for the callback functions).

 

If set to true, the emptyText value will be sent with the form when it is submitted. Defaults to true.

If set to true, the emptyText value will be sent with the form when it is submitted. Defaults to true.

 
The function to call when a valid success return packet is received. The function is passed the following parameters:...

The function to call when a valid success return packet is received. The function is passed the following parameters:

  • form : Ext.form.Basic
    The form that requested the action
  • action : Ext.form.action.Action
    The Action class. The result property of this object may be examined to perform custom postprocessing.

 
The number of seconds to wait for a server response before failing with the failureType as Ext.form.action.Action.CON...

The number of seconds to wait for a server response before failing with the failureType as Ext.form.action.Action.CONNECT_FAILURE. If not specified, defaults to the configured timeout of the form.

 

The URL that the Action is to invoke. Will default to the url configured on the form.

The URL that the Action is to invoke. Will default to the url configured on the form.

 

The message to be displayed by a call to Ext.window.MessageBox.wait during the time the action is being processed.

The message to be displayed by a call to Ext.window.MessageBox.wait during the time the action is being processed.

 

The title to be displayed by a call to Ext.window.MessageBox.wait during the time the action is being processed.

The title to be displayed by a call to Ext.window.MessageBox.wait during the time the action is being processed.

Defined By

Properties

 
Failure type returned when client side validation of the Form fails thus aborting a submit action. Client side valida...

Failure type returned when client side validation of the Form fails thus aborting a submit action. Client side validation is performed unless Ext.form.action.Submit.clientValidation is explicitly set to false.

 
Failure type returned when a communication error happens when attempting to send a request to the remote server. The ...

Failure type returned when a communication error happens when attempting to send a request to the remote server. The response may be examined to provide further information.

 
Failure type returned when the response's success property is set to false, or no field values are returned in the re...

Failure type returned when the response's success property is set to false, or no field values are returned in the response's data property.

 
Failure type returned when server side processing fails and the result's success property is set to false. In the c...

Failure type returned when server side processing fails and the result's success property is set to false.

In the case of a form submission, field-specific error messages may be returned in the result's errors property.

 
Add / override static properties of this class. Ext.define('My.cool.Class', { ... }); My.cool.Class.addStatics(...

Add / override static properties of this class.

Ext.define('My.cool.Class', {
    ...
});

My.cool.Class.addStatics({
    someProperty: 'someValue',      // My.cool.Class.someProperty = 'someValue'
    method1: function() { ... },    // My.cool.Class.method1 = function() { ... };
    method2: function() { ... }     // My.cool.Class.method2 = function() { ... };
});
 
Borrow another class' members to the prototype of this class. Ext.define('Bank', { money: '$$$', printMoney: functi...

Borrow another class' members to the prototype of this class.

Ext.define('Bank', {

money: '$$$',
printMoney: function() {
    alert('$$$$$$$');
}

});

Ext.define('Thief', {

...

});

Thief.borrow(Bank, ['money', 'printMoney']);

var steve = new Thief();

alert(steve.money); // alerts '$$$' steve.printMoney(); // alerts '$$$$$$$'

 
Create a new instance of this Class. Ext.define('My.cool.Class', { ... }); My.cool.Class.create({ someConfig: tr...

Create a new instance of this Class. Ext.define('My.cool.Class', {

...

});

My.cool.Class.create({

someConfig: true

});

 
Create aliases for existing prototype methods. Example: Ext.define('My.cool.Class', { method1: function() { ... ...

Create aliases for existing prototype methods. Example:

Ext.define('My.cool.Class', {
    method1: function() { ... },
    method2: function() { ... }
});

var test = new My.cool.Class();

My.cool.Class.createAlias({
    method3: 'method1',
    method4: 'method2'
});

test.method3(); // test.method1()

My.cool.Class.createAlias('method5', 'method3');

test.method5(); // test.method3() -> test.method1()
 
The type of failure detected will be one of these: Ext.form.action.Action.CLIENT_INVALID, Ext.form.action.Action.SERV...

The type of failure detected will be one of these: Ext.form.action.Action.CLIENT_INVALID, Ext.form.action.Action.SERVER_INVALID, Ext.form.action.Action.CONNECT_FAILURE, or Ext.form.action.Action.LOAD_FAILURE. Usage:

var fp = new Ext.form.Panel({
...
buttons: [{
    text: 'Save',
    formBind: true,
    handler: function(){
        if(fp.getForm().isValid()){
            fp.getForm().submit({
                url: 'form-submit.php',
                waitMsg: 'Submitting your data...',
                success: function(form, action){
                    // server responded with success = true
                    var result = action.result;
                },
                failure: function(form, action){
                    if (action.failureType === Ext.form.action.Action.CONNECT_FAILURE) {
                        Ext.Msg.alert('Error',
                            'Status:'+action.response.status+': '+
                            action.response.statusText);
                    }
                    if (action.failureType === Ext.form.action.Action.SERVER_INVALID){
                        // server responded with success = false
                        Ext.Msg.alert('Invalid', action.result.errormsg);
                    }
                }
            });
        }
    }
},{
    text: 'Reset',
    handler: function(){
        fp.getForm().reset();
    }
}]
 
Add methods / properties to the prototype of this class. Ext.define('My.awesome.Cat', { constructor: function() ...

Add methods / properties to the prototype of this class.

Ext.define('My.awesome.Cat', {
    constructor: function() {
        ...
    }
});

 My.awesome.Cat.implement({
     meow: function() {
        alert('Meowww...');
     }
 });

 var kitty = new My.awesome.Cat;
 kitty.meow();
 
Override prototype members of this class. Overridden methods can be invoked via Ext.Base.callOverridden Ext.define('...

Override prototype members of this class. Overridden methods can be invoked via Ext.Base.callOverridden

Ext.define('My.Cat', {
    constructor: function() {
        alert("I'm a cat!");

        return this;
    }
});

My.Cat.override({
    constructor: function() {
        alert("I'm going to be a cat!");

        var instance = this.callOverridden();

        alert("Meeeeoooowwww");

        return instance;
    }
});

var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
                          // alerts "I'm a cat!"
                          // alerts "Meeeeoooowwww"
 

The raw XMLHttpRequest object used to perform the action.

The raw XMLHttpRequest object used to perform the action.

 

The decoded response object containing a boolean success property and other, action-specific properties.

The decoded response object containing a boolean success property and other, action-specific properties.

 

Invokes this action using the current configuration.

Invokes this action using the current configuration.

 

The type of action this Action instance performs. Currently only "submit" and "load" are supported.

The type of action this Action instance performs. Currently only "submit" and "load" are supported.

Defined By

Methods

 

 

Parameters

  • config : Object

    The configuration for this instance.

Returns

  • void   
 
callOverridden( Array/Arguments args) : Mixed
Call the original method that was previously overridden with Ext.Base.override Ext.define('My.Cat', { constructo...

Call the original method that was previously overridden with Ext.Base.override

Ext.define('My.Cat', {
    constructor: function() {
        alert("I'm a cat!");

        return this;
    }
});

My.Cat.override({
    constructor: function() {
        alert("I'm going to be a cat!");

        var instance = this.callOverridden();

        alert("Meeeeoooowwww");

        return instance;
    }
});

var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
                          // alerts "I'm a cat!"
                          // alerts "Meeeeoooowwww"

Parameters

  • args : Array/Arguments

    The arguments, either an array or the arguments object

Returns

  • Mixed   

    Returns the result after calling the overridden method

 
Get the current class' name in string format. Ext.define('My.cool.Class', { constructor: function() { al...

Get the current class' name in string format.

Ext.define('My.cool.Class', {
    constructor: function() {
        alert(this.self.getName()); // alerts 'My.cool.Class'
    }
});

My.cool.Class.getName(); // 'My.cool.Class'

Returns

  • String   

    className