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>
|
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!