Ajax-form passing value, ajax-form passing

Ajax-form passing value, ajax-form passing

Project 3.1 has come to an end.

From 1.0 to 3.0, we have been working on the basic system. After the 3.0 handover, we started to do the examination system 3.1. I feel more deeply about the project. As long as a project is fully understood, it is the same for any similar project.

Summarize some of the technologies used at the front-end.

1 form value passing

It is more convenient to transmit more values. Add a from form on the corresponding page. The method is post.

<Form id = "editfrom" method = "post" action = "/Student/EditStudent"> <input name = "id" type = "text" value = "" style =" display: none "> <div class =" easyui-tabs "style =" width: 700px; height: 300px; "> <div title =" Personal Information "style =" padding: 0px "> <table style =" margin: auto "> <div class =" fitem "style =" margin-left: 90px; "> <label> Student ID: </label> <input id = "editStudentNo" name = "editStudentNo" class = "easyui-validatebox textbox" data-options = "required: true"> <label> name: </label> <input id = "editName" name = "editName" class = "easyui-validatebox textbox" data-options = "required: true "> </div> <div class =" fitem "style =" margin-left: 90px; "> <label> sex: </label> <input name = "editSex" id = "editBoy" style = "width: 20px" type = "radio" data-options = "required: true "value =" 0 "> male <input id =" editGril "style =" width: 20px "name =" editSex "type =" radio "data-options =" required: true "value =" 1 "> female <label> class: </label> <input id =" editcia "name =" editcia "style =" width: 160px "class =" easyui-combobox "data-options =" required: true "/> </div> <tr> <td> ethnicity: </td> <input type = "text" id = "editNation" class = "easyui-textbox" name = "editNation"/> </td> <td colspan = "2" rowspan = "5"> @ *  * @ <div id =" fileError "> </div> <div id =" fileName "> </div>  <input type =" button "id =" btnupload "onclick =" uploadFile () "value =" Upload "> </td> </tr> <td> mobile phone number: </td> <input type = "text" id = "editCellPhoneNumber" class = "easyui-textbox" name = "editCellPhoneNumber"/> </td> </tr> <tr> <td> ID card number: </td> <input type = "text" class = "easyui-textbox" id = "editCreditCardNo" name = "editCreditCardNo"/> </td> </tr> <tr> <td> Email: </td> <input type = "text" id = "editEmail" class = "easyui-textbox" name = "editCreditCardNo"/> </td> <td colspan = "2"> <input type = "file" class = "easyui-linkbutton" accept = "image/gif, image/jpeg, image/png, gif | jpg | png "multiple =" multiple "id =" fileToUpload "onchange =" fileSelected (); "/> </td> </tr> </table> </div> <div title =" Student Status information "style =" padding: 10px "> <table style =" margin: auto "> <tr> <td style =" text-align: right "> nationality: </td> <input id = "editOrgin" name = "editOrgin" class = "easyui-validatebox textbox" type = "text"/> </td> <td style = "text-align: right "> political outlook: </td> <input id = "editPoliticalStatus" name = "editPoliticalStatus" class = "easyui-validatebox textbox" type = "text"/> </td> </ tr> <td style = "text-align: right "> previous name: </td> <input id = "editpreviusname" name = "editpreviusname" class = "easyui-validatebox textbox" type = "text"/> </td> <td style = "text-align: right "> Admission Ticket No: </td> <input id = "editExamineeNumber" name = "editExamineeNumber" class = "easyui-validatebox textbox" type = "text"/> </td> </ tr> <td style = "text-align: right "> when to join the group (Party ): </td> <input id = "eidtEntryPartyTime" name = "eidtEntryPartyTime" class = "easyui-validatebox textbox" type = "text"/> </td> </ tr> <td> <input id = "editID" name = "editID" class = "easyui-validatebox textbox" type = "text" style = "visibility: hidden "/> </td> <input id =" editDirectionID "name =" editDirectionID "class =" easyui-validatebox textbox "type =" text "style =" visibility: hidden "/> </td> </tr> </table> </div> <div title =" Home Info "style =" padding: 10px "> <table style =" margin: auto "> <tr> <td style =" text-align: right "> Home address: </td> <input id = "editHomeAddress" name = "editHomeAddress" class = "easyui-validatebox textbox" type = "text"/> </td> <td style = "text-align: right "> Home phone: </td> <input id = "editHomeTelephone" name = "editHomeTelephone" class = "easyui-validatebox textbox" type = "text"/> </td> </ tr> <td style = "text-align: right "> father name: </td> <input id = "editFatherName" name = "editFatherName" class = "easyui-validatebox textbox" type = "text"/> </td> <td style = "text-align: right "> father's phone number: </td> <input id = "editFatherPhone" name = "editFatherPhone" name = "editFatherPhone" class = "easyui-validatebox textbox" type = "text"/> </td> </tr> <td style = "text-align: right "> mother name: </td> <input id = "editMotherName" name = "editMotherName" class = "easyui-validatebox textbox" type = "text"/> </td> <td style = "text-align: right "> mother's phone number: </td> <input id = "editMotherPhone" class = "easyui-validatebox textbox" type = "text"/> </td> </tr> <tr> <td style = "text-align: right "> train terminal: </td> <input id = "editTrainDestination" name = "editTrainDestination" class = "easyui-validatebox textbox" type = "text"/> </td> <td style = "text-align: right "> note: </td> <input id = "editNote" name = "editNote" class = "easyui-validatebox textbox" type = "text"/> </td> </ tr> </table> </div> </form>

Then, call the method after the corresponding js write commit event is triggered.

Function OK () {$ ('# editfrom '). form ({url: "/Student/EditStudent", // call the controller's edit onSubmit: function () {}, success: function (data) {$ ('# dg '). datagrid ('reload'); // reload the page $. messager. show ({title: 'message message', msg: 'student information edited! ', Timeout: 5000, showType: 'slide'}); $ (' # editSmallDialogs '). window ('close'); // close the page}, error: function (data) {$. messager. alert ("error", "failed to add. Please contact the administrator! "," Error ") ;}}); $ ('# editfrom'). submit ();}

This should be the case when Controllers gets the value

    Nation = Request["editNation"],

The value of the name of the control on the page corresponding to "editNation.

It is important to read more help documents and check more manuals.

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.