Jquery determines whether the form data changes, and jquery determines the form

Jquery determines whether the form data changes, and jquery determines the form

This article provides three steps for Jquery to determine whether the form data has changed:

1. The idea is:Click a row in the datagrid when you modify it, and bind the page to jump to the Data Binding. When submitting the form, the serial number form is used, and the row data selected by the datagrid is retrieved again for data comparison. </Span>

/*** Determine whether the attribute value in the form is modified ** @ param jsonForm: The json data after the modified form is serialized * @ param row corresponds to the Data Source selected by the datagrid ** @ Return true modify item * false does not exist Modify item */isModified: function (jsonForm, row) {for (key in jsonForm) {// form, but the data source datagrid does not contain if (row [key] = undefined) {continue ;} // "" or null in form, but if (! (JsonForm [key] = null | jsonForm [key] = '') & (row [key] = null | row [key] = '') {// returns true if (jsonForm [key] if the value is different. = Row [key]) return true;} return false ;}

2. Obtain the change information before and after the changed value. Because the project needs to record the change record and save the column Chinese and English information, as shown below:

/*** Get the modified form information ** @ param jsonForm: corresponding to the modified form serialized json data * @ param row corresponds to the Data Source selected by the datagrid * @ param columnJSModel is in the form name attribute: Chinese-English-contrast js, update. reference this js file in jsp ** @ Return json data such as: [{"updateColumn": "loanRatio", "updateColName": "proportion", "updateContent ": "changed from 11 to 100.00"}, * {"updateColumn": "loanQuotaTypeName", "updateColName": "proportional form", "updateContent ": "changed from card to physical"}] **/getModifiedField: function (jsonForm, row, column JSModel) {var modifiedArry = []; var jsonArrStr = ''; for (key in jsonForm) {// form, however, the data source datagrid does not contain if (row [key] = undefined) {continue;} // "" or null in form, but the data source datagrid is null or, if (! (JsonForm [key] = null | jsonForm [key] = '') & (row [key] = null | row [key] = '') {// returns true if (jsonForm [key] if the value is different. = Row [key]) {var jsonObj ={}; jsonObj. updateColumn = key; jsonObj. updateColName = columnJSModel [key]; jsonObj. updateContent = 'changed from' + row [key] + 'to' + jsonForm [key]; modifiedArry [modifiedArry. length] = jsonObj ;}} jsonArrStr = JSON. stringify (modifiedArry); // console. log (jsonArrStr); return jsonArrStr ;}

3. The columnJSModel is a Chinese-English-contrast JS entity. ratio and qutaTypeName correspond to the name attribute names in the form respectively, as shown below:

Var policyColumn = {ratio: 'proportional ', quotaTypeName: 'proportional form '};

The above is all the content of this article, hoping to help you learn.

Articles you may be interested in:

• JQuery EasyUI API Chinese Document-Form
• JQuery implements the form reset button reset to clear the form
• JQuery-serialize () method for outputting serialized form values
• How to Use Jquery to obtain the radio value selected in Form
• How to disable repeated submission when jquery submits a form
• Jquery Method for ajax form submission
• Jquery serialized form json data returned after ajax submission
• Jquery automatically encapsulates form into json
• Form Verification Based on Bootstrap + jQuery. validate
• Get content from jquery form and bind data