mvc中form表单提交的三种方式(推荐)


Posted in Javascript onAugust 10, 2016

第一种方式:submit 按钮 提交

<form action="MyDemand" method="post">
<span>关键字:</span>
<input name="keywords" type="text" value="@keywords" />
<input type="submit" value="搜索" />
</form>

第二种方式: $("#dataform").ajaxSubmit() 提交

<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>
<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 提交

<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>
<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>

以上所述是小编给大家介绍的mvc中form表单提交的三种方式(推荐),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript倒计时代码
Aug 12 Javascript
javascript中创建对象的三种常用方法
Dec 30 Javascript
JavaScript函数详解
Nov 17 Javascript
表单验证正则表达式实例代码详解
Nov 09 Javascript
jQuery实现网页顶部固定导航效果代码
Dec 24 Javascript
jQuery 全选 全不选 事件绑定的实现代码
Jan 23 Javascript
Vue2.0权限树组件实现代码
Aug 29 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
Jan 21 Javascript
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 jQuery
echarts大屏字体自适应的方法步骤
Jul 12 Javascript
小程序中的箭头函数的具体使用
Jun 19 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
Jul 26 Javascript
浅谈JS运算符&amp;&amp;和|| 及其优先级
Aug 10 #Javascript
浅谈jQuery中的checkbox问题
Aug 10 #Javascript
jQuery实现将div中滚动条滚动到指定位置的方法
Aug 10 #Javascript
Three.js学习之网格
Aug 10 #Javascript
js 将图片连接转换成base64格式的简单实例
Aug 10 #Javascript
jQuery实现的选择商品飞入文本框动画效果完整实例
Aug 10 #Javascript
最棒的Angular2表格控件
Aug 10 #Javascript
You might like
社区(php&amp;&amp;mysql)四
2006/10/09 PHP
php设计模式小结
2013/02/15 PHP
Php中使用Select 查询语句的实例
2014/02/19 PHP
详解php 使用Callable Closure强制指定回调类型
2017/10/26 PHP
基于laravel-admin 后台 列表标签背景的使用方法
2019/10/03 PHP
HTML中不支持静态Expando的元素的问题
2007/03/08 Javascript
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
Javascript 面向对象(三)接口代码
2012/05/23 Javascript
js+JQuery返回顶部功能如何实现
2012/12/03 Javascript
Jquery通过Ajax方式来提交Form表单的具体实现
2013/11/07 Javascript
jQuery中noconflict函数的实现原理分解
2015/02/03 Javascript
jQuery插件Validate实现自定义表单验证
2016/01/18 Javascript
Json解析的方法小结
2016/06/22 Javascript
浅谈mvvm-simple双向绑定简单实现
2018/04/18 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
2018/10/24 jQuery
jQuery 同时获取多个标签的指定内容并储存为数组
2018/11/20 jQuery
详解VUE单页应用骨架屏方案
2019/01/17 Javascript
微信小程序开发摇一摇功能
2019/11/22 Javascript
使用Vue生成动态表单
2019/11/26 Javascript
python实现多线程采集的2个代码例子
2014/07/07 Python
Python实现简单登录验证
2016/04/13 Python
python实现用户答题功能
2018/01/17 Python
python实现倒计时小工具
2019/07/29 Python
django 数据库连接模块解析及简单长连接改造方法
2019/08/29 Python
pytorch方法测试详解——归一化(BatchNorm2d)
2020/01/15 Python
PyCharm取消波浪线、下划线和中划线的实现
2020/03/03 Python
python GUI库图形界面开发之PyQt5动态(可拖动控件大小)布局控件QSplitter详细使用方法与实例
2020/03/06 Python
pandas处理csv文件的方法步骤
2020/10/16 Python
 Alo Yoga官网:购买瑜伽服装
2018/06/17 全球购物
意大利单身交友网站:Meetic
2020/07/12 全球购物
经典而简洁的婚礼主持词
2014/03/13 职场文书
领导班子对照检查材料
2014/09/22 职场文书
群众路线教育实践活动民主生活会个人检查对照思想汇报
2014/10/04 职场文书
银行求职信模板
2015/03/20 职场文书
转正申请报告格式
2015/05/15 职场文书
node.js如何自定义实现一个EventEmitter
2021/07/16 Javascript