Key Features: Drag-and-drop functionality; changed ("dirty") field checking functionality; connector functionality.
FormPanels are found throughout the MODx Manager. They can contain form fields, Grids, Trees - just about any component available.
They automatically pass the modAuth header and a Powered-By header into any submissions, which is used to prevent XRSF attacks.
They also automatically integrate into the MODX connector structure. All you must do is pass in a url parameter into the config of the object, and baseParams to send with the form submission, and the FormPanel will handle the rest. With 2.2+ class-based processors and $this->addFieldError(), the MODx.FormPanel will also properly process the errors logged.
MODx.FormPanel adds a few unique parameters not found in typical Ext.FormPanel objects:
|saveMsg||The message to show in the modal wait dialog when saving.||Saving...|
|allowDrop||Allow items from a tree to be dropped in this form.||true|
|useLoadingMask||Set to true to use a loading mask when loading form values.||false|
|onDirtyForm||A form ID to check against when checking dirty status for the form. Defaults to the form.||this.getForm()|
MODx.FormPanel adds a few extra events not found in Ext.FormPanel objects:
|beforeSubmit||Fires before a submission of the form, with 3 parameters:
|failure||Fires on a form failure or failure response from a processor, with 4 parameters:
|fieldChange||Fires whenever a field is changed, with the following parameters:
|postReady||Fires after 'ready' event listeners are run (which must be fired by extending classes)|
|ready||Not fired; must be fired by extended objects of MODx.FormPanel to allow fieldChange/postReady events to fire.|
|setup||Fired at the beginning of a formpanel load, and after a successful submission.|
|success||Fires on a form success with a success response from a processor, with 4 parameters:
Other Unique Functions
Drop Area Fields
All fields in MODx.FormPanel instances automatically can have items dropped into them, such as nodes from the left-hand trees. You can turn off this functionality with the allowDrop parameter.
Automatic Dirty-Field Handling
All fields will fire the fieldChange event when they are changed. You can also use the following methods:
- isDirty - check for general form dirty status
- clearDirty - clear dirty status for all of the form
- markDirty - mark the form dirty and fire the fieldChange event
You can easily manipulate fields and labels in MODx.FormPanel objects:
- getField(name) - Gets the Ext.Field object for the field name specified
- hideField(name) - Hides the field with the name passed
- showField(name) - Shows the field with the name passed if it is hidden
- setLabel(name,text) - Set the label of a field to the specified text.
- MODExt MODx Object
- MODExt Tutorials