formpanel can be used like this, the example on the api:
var panel =Ext.create('Ext.form.Panel', {
title: 'Simple Form',
bodyPadding: 5,
width: 350,
// will pass AJAX Submit the request to this URL
//url: 'save-form.php',
// The form fields Fields will be arranged vertically, taking up the entire width
layout: 'anchor',
defaults: {
anchor: '100%'
},
// The fields
defaultType: 'textfield',
items: [{
fieldLabel : 'First Name',
name: 'first',
allowBlank: false
},{
fieldLabel: 'Last Name',
name: 'last',
allowBlank : false
}],
// Reset and save buttons.
buttons: [{
text: 'Reset',
handler: function() {
this.up('form').getForm().reset();
}
}, {
text: 'Save',
formBind: true, //only enabled once the form is valid
disabled: true,
handler: function() {
var form = this.up('form').getForm();
if (form.isValid()) {
form.submit({
success: function(form, action) {
Ext.Msg.alert('Save successfully', action.result.msg);
},
failure : function(form, action) {
Ext.Msg.alert('Operation failed', action.result.msg);
}
});
}
}
}],
renderTo: Ext.getBody()
);
Looking at the API, the formpanel has no url configuration, and no function to obtain the api. . I think it should be a parameter of the formpanel's parent class. .
Later I took a look at ext.form.basic, and sure enough, there is a url configuration item. .
In Ext, FormPanel does not save form data. The data is saved by BasicForm. When submitting a form, you need to obtain the BasicForm in the current FormPanel for submission.
After obtaining BasicForm object can be used to submit the form
Because there are two components to be used in the project. The only difference between these two components is that the submitted url is different, so I did not define the url when defining the component. This item
and then add different URLs when the component is added to different containers, taking the above example as an example
where needed
panel.getForm().url='../LogSelectServlet';//In different Places can be assigned different URLs like this
This method is a good way to reuse components.