Rumah  >  Artikel  >  hujung hadapan web  >  Contoh perkongsian penyerahan borang dalam pemalam jquery EasyUI_jquery

Contoh perkongsian penyerahan borang dalam pemalam jquery EasyUI_jquery

WBOY
WBOYasal
2016-05-16 15:20:321478semak imbas

Sebelum ini, saya menggunakan AJax untuk menghantar parameter kepada Pengawal, dan kemudian memanggil kaedah bahagian pelayan untuk membuat perubahan pada pangkalan data Hari ini saya menemui kaedah baharu, iaitu penyerahan borang, yang boleh menjimatkan keperluan untuk AJax lulus parameter.

Selepas borang diserahkan, kita boleh mendapatkan nilai dalam kawalan pada borang, dan kemudian memanggil kaedah bahagian pelayan untuk membuat perubahan pada pangkalan data. Tangkapan skrin di bawah ialah keperluan perniagaan khusus.


1. Fungsi untuk dilaksanakan: Daripada borang di atas, dapatkan nilai dalam kawalan dan kemudian hantar ke latar belakang. Di bawah ialah kod borang.
2. Kod borang

<div id="Editwin" class="easyui-window" title="编辑班级信息" style="width: 400px; height: auto;top:105px" data-options="closed:true,collapsible:false,minimizable:false,maximizable:false"> 
  <div style="margin-top: 30px; margin-bottom: 30px; margin-left: 70px;"> 
    <form id="EditForm" method="post"> 
      <table> 
        <tr> 
          <td>班级名称:</td> 
          <td> 
             <input class="easyui-validatebox" type="text" id="EditClassName" name="ClassName" data-options="required:true,validType:['maxLength[20]']"/> 
          </td> 
        </tr> 
        <tr> 
          <td> 
            <input style="display:none" class="easyui-textbox" type="text" id="EditClassID" name="ClassID" data-options="required:true"/> 
          </td> 
        </tr> 
        <tr> 
          <td>所属机构:</td> 
          <td> 
            <input id="EditOrganizationID" class="easyui-combobox" name="OrganizationName1" data-options="required:true"/> 
        </tr>      
        <tr> 
          <td>年级:</td> 
          <td> 
            <input id="EditGradeID" class="easyui-combobox" name="GradeName" data-options="required:true"/>  
        </tr> 
 
        <tr> 
          <td>备注:</td> 
          <td> 
            <textarea class="easyui-validatebox" id="NoteId" name="Note" validType:['maxLength[50]></textarea> 
        </tr> 
        </table> 
 
      <div style="margin-top: 20px;"> 
        <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" style="margin-left: 10px;" onclick="EditsubmitForm()">确定</a> 
        <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" style="margin-left: 60px;" onclick="EditclearForm()">取消</a> 
      </div> 
    </form> 
  </div> 
</div> 

3. Kod penghantaran borang

function EditsubmitForm() { 
      $('#EditForm').form('submit', { 
        url: "/BasicClass/ModifyClassInfo", 
        onSubmit: function () {        //表单提交前的回调函数 
          var isValid = $(this).form('validate');//验证表单中的一些控件的值是否填写正确,比如某些文本框中的内容必须是数字 
          if (!isValid) { 
          } 
          return isValid; // 如果验证不通过,返回false终止表单提交 
        }, 
        success: function (data) {  //表单提交成功后的回调函数,里面参数data是我们调用/BasicClass/ModifyClassInfo方法的返回值。 
          if (data > 0) { 
            $.messager.show({ 
              title: '提示消息', 
              msg: '提交成功', 
              showType: 'show', 
              timeout: 1000, 
              style: { 
                right: '', 
                bottom: '' 
              } 
            }); 
            $('#dg').datagrid('reload');  // 重新载入当前页面数据  
            $('#Editwin').window('close'); //关闭窗口 
          } 
          else { 
            $.messager.alert('提示信息', '提交失败,请联系管理员!', 'warning'); 
        } 
        } 
      }); 
} 

4. Pengawal latar belakang mendapatkan data dalam bentuk

//获得要添加的班级的名称 
       string ClassName = Request.Form["ClassName"]; 
       //获得班级ID 
       Guid ClassID = new Guid(Request.Params["ClassID"]); 
       string ClassNote = Request.Form["Note"]; 

Selepas latihan pertama, saya rasa ia lebih mudah digunakan daripada parameter lulus AJax, kerana AJax perlu menulis semua nama setiap parameter semasa menghantar parameter, dan apabila borang diserahkan, semua kandungan dalam borang akan dihantar secara lalai, supaya dalam borang Selagi ada apa-apa data, kami boleh mendapatkannya di latar belakang Sudah tentu, data itu terikat terlebih dahulu, atau kami telah mengisinya sebelum ini.

Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu semua orang untuk mempelajari pengaturcaraan jquery.

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn