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 : Booleandata
property : Objectdata
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.FormPanel({
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.
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.
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.urlEncode.
var fp = new Ext.form.FormPanel({
...
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.Ext.form.action.Action.CONNECT_FAILURE) {
Ext.Msg.alert('Error',
'Status:'+action.response.status+': '+
action.response.statusText);
}
if (action.failureType === Ext.form.action.Action.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();
}
}]
Get the reference to the current class from which this object was instantiated. Unlike Ext.Base.statics,
this.self
is scope-dependent and it's meant to be used for dynamic inheritance. See Ext.Base.statics
for a detailed comparison
Ext.define('My.Cat', {
statics: {
speciciesName: 'Cat' // My.Cat.speciciesName = 'Cat'
},
constructor: function() {
alert(this.self.speciciesName); / dependent on 'this'
return this;
},
clone: function() {
return new this.self();
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciciesName: 'Snow Leopard' // My.SnowLeopard.speciciesName = 'Snow Leopard'
}
});
var kitty = new My.Cat(); // alerts 'Cat'
var katty = new My.SnowLeopard(); // alerts 'Snow Leopard'
var cutie = katty.clone();
alert(Ext.getClassName(cutie)); // alerts 'My.SnowLeopard'
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"
The arguments, either an array or the arguments
object
Call the overridden superclass' method. For example:
Ext.define('My.own.A', {
constructor: function(test) {
alert(test);
}
});
Ext.define('My.own.B', {
constructor: function(test) {
alert(test);
this.callParent([test + 1]);
}
});
var a = new My.own.A(1); // alerts '1'
var b = new My.own.B(1); // alerts '1', then alerts '2'
The arguments, either an array or the arguments
object
from the current method, for example: this.callParent(arguments)
Get the reference to the class from which this object was instantiated. Note that unlike Ext.Base.self,
this.statics()
is scope-independent and it always returns the class from which it was called, regardless of what
this
points to during runtime
Ext.define('My.Cat', {
statics: {
speciciesName: 'Cat' // My.Cat.speciciesName = 'Cat'
},
constructor: function() {
alert(this.statics().speciciesName); // always equals to 'Cat' no matter what 'this' refers to
// equivalent to: My.Cat.speciciesName
alert(this.self.speciciesName); // dependent on 'this'
return this;
},
clone: function() {
var cloned = new this.self; // dependent on 'this'
cloned.groupName = this.statics().speciciesName; // equivalent to: My.Cat.speciciesName
return cloned;
}
});
Ext.define('My.SnowLeopard', {
statics: {
speciciesName: 'Snow Leopard' // My.SnowLeopard.speciciesName = 'Snow Leopard'
},
constructor: function() {
this.callParent();
}
});
var kitty = new My.Cat(); // alerts 'Cat', then alerts 'Cat'
var katty = new My.SnowLeopard(); // alerts 'Cat', then alerts 'Snow Leopard'
var cutie = kitty.clone();
alert(Ext.getClassName(cutie)); // alerts 'My.SnowLeopard'
alert(cutie.groupName); // alerts 'Cat'