jquery插件EasyUI中form表单提交实例分享

前端之家收集整理的这篇文章主要介绍了jquery插件EasyUI中form表单提交实例分享前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

之前用AJax给Controller传递参数,然后再调用服务端的方法数据库进行更改,今天碰到一个新的方法,就是表单的提交,这样可以省去AJax传参。

当表单提交后,我们可以获取表单上控件中的值,然后再调用服务端的方法数据库进行更改。下面的一张截图是具体的业务需求。

一、要实现的功能:从上面这个表单中,获取控件中的值,然后传递给后台。下面是表单代码。 二、表单代码

名称:Box" type="text" id="EditClassName" name="ClassName" data-options="required:true,validType:['maxLength[20]']"/> Box" type="text" id="EditClassID" name="ClassID" data-options="required:true"/> Box" name="OrganizationName1" data-options="required:true"/> Box" name="GradeName" data-options="required:true"/> <tr&gt; <td&gt;备注:</td&gt; <td&gt; <textarea class="easyui-validatebox" id="NoteId" name="Note" validType:['maxLength[50]></textarea> </tr&gt; </table&gt; <div style="margin-top: 20px;"&gt; <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" style="margin-left: 10px;" onclick="EditsubmitForm()"&gt;确定</a> <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" style="margin-left: 60px;" onclick="EditclearForm()"&gt;取消</a> </div> </form>

三、表单提交代码

404_24@ 0) { $.messager.show({ title: '提示消息',msg: '提交成功',showType: 'show',timeout: 1000,style: { right: '',bottom: '' } }); $('#dg').datagrid('reload'); // 重新载入当前页面数据 $('#Editwin').window('close'); //关闭窗口 } else { $.messager.alert('提示信息','提交失败,请联系管理员!','warning'); } } }); }

四、后台Controller获得表单中的数据

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

初学乍练,感觉比AJax传参好用多了,因为AJax穿参时需要将各个参数的名字全部写进去,而表单提交时,默认将表单中的内容全部传送过去,这样表单中只要有什么数据我们就可以在后台获取什么数据,当然了,这些数据是提前绑定好的,或者是我们之前填写好的。

以上就是本文的全部内容,希望对大家学习jquery程序设计有所帮助。

原文链接:https://www.f2er.com/jquery/50615.html

猜你在找的jQuery相关文章