mvc中form表单提交的几种形式
第一种方式:submit 按钮 提交
1
2
3
4
5
|
<form action= "MyDemand" method= "post" > <span>关键字:</span> <input name= "keywords" type= "text" value= "@keywords" /> <input type= "submit" value= "搜索" /> </form> |
第二种方式: $("#dataform").ajaxSubmit() 提交
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<form id= "dataform" action= "UpdateUserInfo" enctype= "multipart/form-data" method= "post" > <table style= "width:100%;border:0;" cellpadding= "0" cellspacing= "0" > <tbody> <tr> <td width= "40" >名字:</td> <td><input type= "text" name= "nvc_name" id= "nvc_name" value= "@Model.nvc_name" /></td> </tr> <tr> <td colspan= "2" align= "center" > <input type= "button" value= "保存" id= "btnsubmit" /> </td> </tr> </tbody> </table> </form> |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script src= "http://code.jquery.com/jquery-1.11.0.min.js" ></script> <script src= "http://malsup.github.io/jquery.form.js" ></script> //ajaxForm 依赖脚本 <script type= "text/javascript" > $(document).ready(function () { $( "#btnsubmit" ).click(function () {if ($( "[name='nvc_name']" ).val() == "" ) { alert( "请填写名字" ); $( "[name='nvc_name']" ).focus(); return; } $( "#dataform" ).ajaxSubmit(function (r) { alert(r.Msg); if (r.success) { location.reload(); } }) }) }); </script> |
第三种方式:post 提交
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<table style= "width:100%;border:0px;" cellpadding= "0" cellspacing= "0" > <tbody> <tr> <td width= "15%" align= "right" >手机号:</td> <td><input type= "text" placeholder= "请输入手机号" id= "nvc_user_name" /></td> </tr> <tr> <td colspan= "2" align= "center" > <input type= "button" value= "保存" id= "btnsubmit" /> </td> </tr> </tbody> </table> |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script type= "text/javascript" > $( function () { $( "#btnsubmit" ).click( function () { var nvc_user_name = document.getElementById( 'nvc_user_name' ); $.post( '/Interface/ModefiyPwd' , { nvc_user_name: nvc_user_name.value, }, function (data) { if (data.success) { $( "#successdiv" ).show(); $( "#editdiv" ).hide(); } else { layer.msg(data.Msg); } }); }); }) </script> |
第四种方式:为from 中的button 添加 onclick事件 验证表单 后提交
1
2
3
4
5
6
7
8
9
10
11
12
13
|
< form method = "post" action = "RecordEdit" id = "dataForm" > < table width = "100%" border = "0" cellspacing = "0" cellpadding = "0" > < tr > < td align = "right" >应用路径:</ td > < td > < input type = "text" name = "nvc_app_path" id = "nvc_app_path" > </ td > </ tr > < tr class = "b_tr2" > < td >< input type = "button" onclick = "CheckForm();" value = "保存" ></ td > </ tr > </ table > </ form > |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<script src= "http://libs.baidu.com/jquery/1.7.2/jquery.js" ></script> <script src= "~/Scripts/layer/layer.js" ></script> <script type= "text/javascript" > function CheckForm() { if ($( "#nvc_app_path" ).val().length == 0) { layer.tips( "应用路径不能为空" , "#nvc_app_path" ); return ; } $( "#dataForm" ).submit(); } </script> <br> |
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!