第一种用法:

在MVC中,依然可以使用ajax校验,跟在WebForm中的使用时一样的,唯一的区别就是将以前的URL路劲改为访问控制器下的行为

前台
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btn").click(function () {
$.post("/Home/ShowUserName", {}, function (data) {
var data = $.parseJSON(data);
for (var i = 0; i < data.length; i++) {
$("#div").append(data[i]);
}
})
})
});
</script>
</head>
<body>
<div>
<input type="button" id="btn" value="加载"/>
<div id="div"></div>
</div>
</body>
</html> 后台
public ActionResult ShowUserName()
{
IQueryable<string> teacherNameList= dbContext.Teacher.Select(u => u.TeacherName);
JavaScriptSerializer js = new JavaScriptSerializer();
string nameList= js.Serialize(teacherNameList);
return Content(nameList);
}

其实对于MVC中已经对json做了更好的封装,就后台代码而言,可以返回JsonResult,所以可以省掉自己手写JavaScriptSerializer类

第二种用法:

MVC中已经对ajax校验进行了很好的封装,可以使用相关的类库直接点出来。

Ajax.BeginForm(...)

首先因为即使微软的MVC进行封装了,它依然依赖于ajax,所以需要添加相应的j文件

<script src="~/Scripts/jquery-1.8.2.min.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script type="text/javascript">
function Hello(data)
{
alert("hello"+data); }
</script> </head>
<body>
<div>
@using (Ajax.BeginForm("Index1", "ajax", new AjaxOptions() { Confirm = "确定要删除吗", HttpMethod = "post", OnSuccess = "Hello" }))
{
<input type="submit" value="提交" />
} </div>
</body>
</html>

上面的代码实现了异步提交的操作,当然Ajax.BeginForm有很多的重载,可以实现基本所有的手写的功能,同时发现其中的提交按钮的类型是submit类型,但是依然是走的异步调用的流程,具体的原因是,隐式JS文件中,首先会找到这个打了标记的Form表单,然后将表单中的数据进行异步传输,而不会受到后面这个提交按钮的影响。

MVC之AJAX异步提交表单的更多相关文章

  1. ASP.NET MVC 网站开发总结(五)——Ajax异步提交表单之检查验证码

    首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般 ...

  2. jquery ajax异步提交表单数据

    使用jquery的ajax方法可以异步提交表单,成功后后台返回json数据,回调函数处理,可以不用刷新页面,达到异步的目的: 处理表单的数据可以用serialize()方法进行序列化,而如果提交的数据 ...

  3. 使用ajax异步提交表单

    虽然这篇文章的标题是提交表单,但是主要的难点在于使用ajax提交文本域的内容, 在工作中的经常会需要ajax跨域的问题,通常的需求使用jsonp就可以得到解决,但是当前项目中有一个图片服务器,客户端需 ...

  4. 使用AJAX异步提交表单的几种方式

    方式一 手工收集所有的用户输入,封装为大的“k1=v1&k2=v2…”键值对形式,使用$.post(url, data,fn)把数据提交给服务器 $.ajax({ type:'post', u ...

  5. 雷林鹏分享:jQuery EasyUI 表单 - 创建异步提交表单

    jQuery EasyUI 表单 - 创建异步提交表单 本教程向您展示如何通过 easyui 提交一个表单(Form).我们创建一个带有 name.email 和 phone 字段的表单.通过使用 e ...

  6. jquery ajax异步提交表单数据的方法

    使用jquery的ajax方法可以异步提交表单,成功后后台返回json数据,回调函数处理,可以不用刷新页面,达到异步的目的: 处理表单的数据可以用serialize()方法进行序列化,而如果提交的数据 ...

  7. Ajax实现提交表单时验证码自动验证(原创自Zjmainstay)

    本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> &l ...

  8. SpringMVC中的异步提交表单

    1.前言 近期在做一个项目,前台框架用的是EasyUI+SpringMVC,因为对SpringMVC不太了解,所以刚開始接触的时候有点吃力,在此通过一个EasyUi中的DataGrid表格来总结一下. ...

  9. jQuery.Form.js 异步提交表单使用总结

    jQuery.Form.js 是一个用于使用jQuery异步提交表单的插件,它使用方法简单,支持同步和异步两种方式提交. 第一步:引入jQuery与jQuery.Form.js <script ...

随机推荐

  1. Spring Boot 官方文档学习(二)特点

    一.SpringApplication banner,就是启动时输出的信息,可以在classpath下添加 banner.txt,或者设置 banner.location 来指向特定的文件.(默认编码 ...

  2. oracle hint inline materialize

    当我们使用with的时候,oracle可能会把with里面的结果转换为暂时表.这是仅仅是可能,由于CBO会推断. inline是不转换成暂时表.materialize是强制转换成暂时表. 制造数据 d ...

  3. org.xml.sax.SAXParseException: prolog 中不允许有内容

    org.xml.sax.SAXParseException: prolog 中不允许有内容 digester.fatalError 不下心踢了电源导致的错误应该是解析xml出问题,找了半天不知道哪个x ...

  4. 字符串池化 python

    前言 在 Python 中经常通过内存池化技术来提高其性能,那么问题来了,在什么情况下会池化呢? 让我们通过几个例子进行一下理解一下. 预备知识 在查看例子之前,首先要提 python 中的一个函数 ...

  5. Sql 关键字with

    我在写一篇时候,被很多同学说没技术含量,实际在开发过程中,我们做递归实际是在数据库端处理,把当前子集所有的都给递归出来.再 程序里再循环匹配的 这样性能就会快多了. 这里涉及到一个sqlserver的 ...

  6. 如何Request客户端的传值的Data

    我们在做B/S的项目,客户端向服务端传值的时候,一般都是request接受. Request常用三个接受方式为:Request.QueryString,Request.Form,Request.Par ...

  7. Codeforces Round #313 D. Equivalent Strings(DFS)

    D. Equivalent Strings time limit per test 2 seconds memory limit per test 256 megabytes input standa ...

  8. 06python 之基本数据类型

    数字 int(整型) 在32位机器上,整数的位数为32位,取值范围为-2**31~2**31-1,即-2147483648~2147483646 在64位机器上,整数的位数为64位,取值范围为-2** ...

  9. Linux系统故障排除

    可能出现的故障: 1,管理员密码忘记 进入单用户模式修改密码 2.系统无法正常启动 a.grub损坏(MBR损坏,grub配置文件丢失) b.系统初始化故障(某文件系统无法正常挂载.驱动不兼容) c. ...

  10. apache编译安装完成后的服务启动设置

    Apache安装后可通过其安装路径的bin目录下的apachectl脚本控制服务的启动和停止.本例中apache安装在/usr/local/apache-2.2.6,服务控制脚本为: /usr/loc ...