|
|
Ext.form.action Namespace
Download SDK: SharpKit.ExtJs.zip
Classes
|
Action
|
The subclasses of this class provide actions to perform upon Forms. Instances of this class are only created by a Form when
the Form needs to perform an action such as submit or load. The Configuration options
listed for this class are set through the Form's action methods: submit,
load and doAction The instance of Action which performed the action is passed to the success
and failure callbacks of the Form's action methods (submit,
load and doAction),
and to the actioncomplete and
actionfailed event handlers.
|
|
|
ActionConfig
|
|
|
|
ActionEvents
|
|
|
|
DirectLoad
|
Provides Ext.direct.Manager support for loading form data. This example illustrates usage of Ext.direct.Direct to load a form through Ext.Direct. var myFormPanel = new Ext.form.Panel({
// configs for FormPanel
title: 'Basic Information',
renderTo: document.body,
width: 300, height: 160,
padding: 10,
// configs apply to child items
defaults: {anchor: '100%'},
defaultType: 'textfield',
items: [{
fieldLabel: 'Name',
name: 'name'
},{
fieldLabel: 'Email',
name: 'email'
},{
fieldLabel: 'Company',
name: 'company'
}],
// configs for BasicForm
api: {
// The server-side method to call for load() requests
load: Profile.getBasicInfo,
// The server-side must mark the submit handler as a 'formHandler'
submit: Profile.updateBasicInfo
},
// specify the order for the passed params
paramOrder: ['uid', 'foo']
});
// load the form
myFormPanel.getForm().load({
// pass 2 arguments to server side getBasicInfo method (len=2)
params: {
foo: 'bar',
uid: 34
}
});
The data packet sent to the server will resemble something like: [
{
"action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
"data":[34,"bar"] // note the order of the params
}
]
The form will process a data packet returned by the server that is similar
to the following format: [
{
"action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
"result":{
"success":true,
"data":{
"name":"Fred Flintstone",
"company":"Slate Rock and Gravel",
"email":"fred.flintstone@slaterg.com"
}
}
}
]
|
|
|
DirectLoadConfig
|
|
|
|
DirectLoadEvents
|
|
|
|
DirectSubmit
|
Provides Ext.direct support for submitting form data. This example illustrates usage of Ext.direct.Direct to submit a form through Ext.Direct. var myFormPanel = new Ext.form.Panel({
// configs for FormPanel
title: 'Basic Information',
renderTo: document.body,
width: 300, height: 160,
padding: 10,
buttons:[{
text: 'Submit',
handler: function(){
myFormPanel.getForm().submit({
params: {
foo: 'bar',
uid: 34
}
});
}
}],
// configs apply to child items
defaults: {anchor: '100%'},
defaultType: 'textfield',
items: [{
fieldLabel: 'Name',
name: 'name'
},{
fieldLabel: 'Email',
name: 'email'
},{
fieldLabel: 'Company',
name: 'company'
}],
// configs for BasicForm
api: {
// The server-side method to call for load() requests
load: Profile.getBasicInfo,
// The server-side must mark the submit handler as a 'formHandler'
submit: Profile.updateBasicInfo
},
// specify the order for the passed params
paramOrder: ['uid', 'foo']
});
The data packet sent to the server will resemble something like: {
"action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
"result":{
"success":true,
"id":{
"extAction":"Profile","extMethod":"updateBasicInfo",
"extType":"rpc","extTID":"6","extUpload":"false",
"name":"Aaron Conran","email":"aaron@sencha.com","company":"Sencha Inc."
}
}
}
The form will process a data packet returned by the server that is similar
to the following: // sample success packet (batched requests)
[
{
"action":"Profile","method":"updateBasicInfo","type":"rpc","tid":3,
"result":{
"success":true
}
}
]
// sample failure packet (one request)
{
"action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
"result":{
"errors":{
"email":"already taken"
},
"success":false,
"foo":"bar"
}
}
Also see the discussion in Ext.form.action.DirectLoad.
|
|
|
DirectSubmitConfig
|
|
|
|
DirectSubmitEvents
|
|
|
|
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.
|
|
|
LoadConfig
|
|
|
|
LoadEvents
|
|
|
|
StandardSubmit
|
A class which handles submission of data from Forms using a standard
<form> element submit. It does not handle the response from the submit. If validation of the form fields fails, the Form's Ext.form.Basic.afterAction method
will be called. Otherwise, afterAction will not be called. Instances of this class are only created by a Form when
submitting, when the form's Ext.form.Basic.standardSubmit
config option is true.
|
|
|
StandardSubmitConfig
|
|
|
|
StandardSubmitEvents
|
|
|
|
Submit
|
A class which handles submission of data from Forms
and processes the returned response. Instances of this class are only created by a Form when
submitting. Response Packet Criteria A response packet may contain:
success property : Boolean
The success property is required. errors property : Object
The errors property,
which is optional, contains error messages for invalid fields. JSON Packets By default, response packets are assumed to be JSON, so a typical response
packet may look like this: {
success: false,
errors: {
clientCode: "Client not found",
portOfLoading: "This field must not be null"
}
} Other data may be placed into the response for processing by the Ext.form.Basic's callback
or event handler methods. The object decoded from this JSON is available in the
result property. Alternatively, if an errorReader is specified as an XmlReader: errorReader: new Ext.data.reader.Xml({
record : 'field',
success: '@success'
}, [
'id', 'msg'
]
)
then the results may be sent back in XML format: <?xml version="1.0" encoding="UTF-8"?>
<message success="false">
<errors>
<field>
<id>clientCode</id>
<msg><![CDATA[Code not found. <br /><i>This is a test validation message from the server </i>]]></msg>
</field>
<field>
<id>portOfLoading</id>
<msg><![CDATA[Port not found. <br /><i>This is a test validation message from the server </i>]]></msg>
</field>
</errors>
</message>
Other elements may be placed into the response XML for processing by the Ext.form.Basic's callback
or event handler methods. The XML document is available in the errorReader's xmlData property.
|
|
|
SubmitConfig
|
|
|
|
SubmitEvents
|
|
|
SharpKit.AspNetAjax
Ext