Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
wiki:form_editing [2011/03/20 21:55] olegk include zIndex parameter in the list of delGridRow properties |
wiki:form_editing [2017/12/12 17:19] (current) admin |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ~~ODT~~ | ||
| ====== Form Editing ====== | ====== Form Editing ====== | ||
| Line 87: | Line 86: | ||
| |editData|an array used to add content to the data posted to the server|empty| | |editData|an array used to add content to the data posted to the server|empty| | ||
| |recreateForm|when set to true the form is recreated every time the dialog is activeted with the new options from colModel (if they are changed)|false| | |recreateForm|when set to true the form is recreated every time the dialog is activeted with the new options from colModel (if they are changed)|false| | ||
| - | |zIndex|The starting z-index for the dialog. If you will see the dialog form under another elements or dialogs you should use the parameter with some value higher as default value 950. In the most cases it should be the value higher as 1000 - the default value of jQuery UI dialog.|950| | ||
| |jqModal|If set to true uses jqModal plugin (if present) to creat the dialogs. If set to true and the plugin is not present jqGrid uses its internal function to create dialog|true| | |jqModal|If set to true uses jqModal plugin (if present) to creat the dialogs. If set to true and the plugin is not present jqGrid uses its internal function to create dialog|true| | ||
| |addedrow|Controls where the row just added is placed: 'first' at the top of the gird, 'last' at the bottom. Where the new row is to appear in its natural sort order, set reloadAfterSubmit: true|first| | |addedrow|Controls where the row just added is placed: 'first' at the top of the gird, 'last' at the bottom. Where the new row is to appear in its natural sort order, set reloadAfterSubmit: true|first| | ||
| Line 105: | Line 103: | ||
| |ajaxEditOptions|This option allow to set global ajax settings for the form editiing when we save the data to the server. Note that with this option is possible to overwrite all current ajax setting in the save request including the complete event.|empty object| | |ajaxEditOptions|This option allow to set global ajax settings for the form editiing when we save the data to the server. Note that with this option is possible to overwrite all current ajax setting in the save request including the complete event.|empty object| | ||
| |viewPagerButtons| This option enable or disable the appearing of the previous and next buttons (pager buttons) in the form |true| | |viewPagerButtons| This option enable or disable the appearing of the previous and next buttons (pager buttons) in the form |true| | ||
| + | |zIndex|The starting z-index for the dialog. If you will see the dialog form under another elements or dialogs you should use the parameter with some value higher as default value 950. In the most cases it should be the value higher as 1000 - the default value of jQuery UI dialog.|950| | ||
| === Events === | === Events === | ||
| Line 114: | Line 113: | ||
| |afterSubmit| fires after response has been received from server. Typically used to display status from server (e.g., the data is successfully saved or the save cancelled for server-side editing reasons). Receives as parameters the data returned from the request and an array of the posted values of type id=value1,value2. \\ When used this event should return array with the following items [success, message, new_id] \\ where \\ //success// is a boolean value if true the process continues, if false a error //message// appear and all other processing is stopped. (message is ignored if success is true). \\ //new_id// can be used to set the new row id in the grid when we are in add mode. \\ afterSubmit : function(response, postdata) \\ { \\ ... \\ return [success,message,new_id] \\ } | | |afterSubmit| fires after response has been received from server. Typically used to display status from server (e.g., the data is successfully saved or the save cancelled for server-side editing reasons). Receives as parameters the data returned from the request and an array of the posted values of type id=value1,value2. \\ When used this event should return array with the following items [success, message, new_id] \\ where \\ //success// is a boolean value if true the process continues, if false a error //message// appear and all other processing is stopped. (message is ignored if success is true). \\ //new_id// can be used to set the new row id in the grid when we are in add mode. \\ afterSubmit : function(response, postdata) \\ { \\ ... \\ return [success,message,new_id] \\ } | | ||
| |beforeCheckValues|This event fires before checking the values (if checking is defined in colModel via editrules option). \\ To this event we pass the following parameters: \\ 1. //posdata// - the array of values which should be chaced in name:value pair, where the name is the name from colModel. \\ 2. //formid// - the form id object. \\ 3. //mode// - the current mode in which we are - can be add or edit. \\ In all cases the event should return object in name value pair which then will be posted to the server.| | |beforeCheckValues|This event fires before checking the values (if checking is defined in colModel via editrules option). \\ To this event we pass the following parameters: \\ 1. //posdata// - the array of values which should be chaced in name:value pair, where the name is the name from colModel. \\ 2. //formid// - the form id object. \\ 3. //mode// - the current mode in which we are - can be add or edit. \\ In all cases the event should return object in name value pair which then will be posted to the server.| | ||
| - | |beforeInitData|fires before initialize the new form data. Receives, as parameter, the id of the constructed form. \\ beforeInitData : function(formid) {...} | | + | |beforeInitData|fires before initialize the new form data. Receives, as parameter, the jQuery object of the constructed form. The Event can return true or false.If the event return false the the action is not done and the form is not lunched.\\ beforeInitData : function(formid) {...} | |
| |beforeShowForm|fires before showing the form with the new data; receives as Parameter the id of the constructed form. \\ beforeShowForm : function(formid) {...} | | |beforeShowForm|fires before showing the form with the new data; receives as Parameter the id of the constructed form. \\ beforeShowForm : function(formid) {...} | | ||
| |beforeSubmit|fires before the data is submitted to the server. Recieves as parameter the posted data array and the formid. \\ beforeSubmit : function(postdata, formid) { \\ ... \\ return[success,message]; \\ } \\ When defined this event should return array with the following values \\ //success// boolean indicating if the proccess should continue (true) or a error (false) //message// should appear to the user| | |beforeSubmit|fires before the data is submitted to the server. Recieves as parameter the posted data array and the formid. \\ beforeSubmit : function(postdata, formid) { \\ ... \\ return[success,message]; \\ } \\ When defined this event should return array with the following values \\ //success// boolean indicating if the proccess should continue (true) or a error (false) //message// should appear to the user| | ||
| Line 159: | Line 158: | ||
| or with the new API | or with the new API | ||
| <code javascript> | <code javascript> | ||
| - | jQuery("#grid_id").jqGrid('editGridRow, "new", properties ); | + | jQuery("#grid_id").jqGrid('editGridRow', "new", properties ); |
| </code> | </code> | ||
| Line 263: | Line 262: | ||
| |labelswidth|Since we construct the view with table element it is difficult to calculate, in this case, how much width is needed for the labels. Depending on the needs this value can be increased or decreased|30%| | |labelswidth|Since we construct the view with table element it is difficult to calculate, in this case, how much width is needed for the labels. Depending on the needs this value can be increased or decreased|30%| | ||
| |viewPagerButtons| This option enable or disable the appearing of the previous and next buttons (pager buttons) in the form |true| | |viewPagerButtons| This option enable or disable the appearing of the previous and next buttons (pager buttons) in the form |true| | ||
| + | |zIndex|The starting z-index for the dialog. If you will see the dialog form under another elements or dialogs you should use the parameter with some value higher as default value 950. In the most cases it should be the value higher as 1000 - the default value of jQuery UI dialog.|950| | ||
| + | |recreateForm|when set to true the form is recreated every time the dialog is activated with the new options from colModel (if they are changed) |false| | ||
| === Events === | === Events === | ||
| Line 332: | Line 333: | ||
| |mtype|Defines the type of request to make ("POST" or "GET") when data is sent to the server|POST| | |mtype|Defines the type of request to make ("POST" or "GET") when data is sent to the server|POST| | ||
| |delData|an array used to add content to the data posted to the server|empty| | |delData|an array used to add content to the data posted to the server|empty| | ||
| - | |zIndex|The starting z-index for the dialog. If you will see the dialog form under another elements or dialogs you should use the parameter with some value higher as default value 950. In the most cases it should be the value higher as 1000 - the default value of jQuery UI dialog.|950| | ||
| |jqModal|If set to true uses jqModal plugin (if present) to creat the dialogs. If set to true and the plugin is not present jqGrid uses its internal function to create dialog|true| | |jqModal|If set to true uses jqModal plugin (if present) to creat the dialogs. If set to true and the plugin is not present jqGrid uses its internal function to create dialog|true| | ||
| |delicon| array. Determines the icon of the submit button. The default value is [true,"left","ui-icon-delete"]. The first item enables/disables the icon. The second item tells where to put the icon to left or to right of the text. The third item corresponds to valid ui icon from theme roller | | | |delicon| array. Determines the icon of the submit button. The default value is [true,"left","ui-icon-delete"]. The first item enables/disables the icon. The second item tells where to put the icon to left or to right of the text. The third item corresponds to valid ui icon from theme roller | | | ||
| Line 339: | Line 339: | ||
| |closeOnEscape|When set to true the modal window can be closed with ESC key from the user.|false| | |closeOnEscape|When set to true the modal window can be closed with ESC key from the user.|false| | ||
| |ajaxDelOptions|This option allow to set global ajax settings for the form editiing when we delete the data to the server. Note that with this option is possible to overwrite all current ajax setting in the save request including the complete event.|empty object| | |ajaxDelOptions|This option allow to set global ajax settings for the form editiing when we delete the data to the server. Note that with this option is possible to overwrite all current ajax setting in the save request including the complete event.|empty object| | ||
| + | |zIndex|The starting z-index for the dialog. If you will see the dialog form under another elements or dialogs you should use the parameter with some value higher as default value 950. In the most cases it should be the value higher as 1000 - the default value of jQuery UI dialog.|950| | ||
| === Events === | === Events === | ||
