本文摘自PHP中文网,作者小葫芦,侵删。
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>
|
相关阅读 >>
MVC页面之间参数传递的实例解析
详解jsonresult的使用方法
在core中使用MVC路由的配置
MVC form表单提交的几种形式整理总结
实现MVC文件上传支持批量上传拖拽及预览文件内容校验功能的代码示例
更多相关阅读请进入《MVC》频道 >>
转载请注明出处:木庄网络博客 » mvc form表单提交的几种形式整理总结