在ASP.NET MVC中，有一个官方提供的AJAXHelper帮助我们做AJAX相关的东西。我用传统的jQuery AJAX技术和AJAXHelper分别实现同一个demo,特此记录一下。

由于是在MVC中，所以创建了一个Home控制器，里面有两个Action,Login()用于一个普通页面，GetInfo()用于返回一个json字符串，定义如下

public class HomeController : Controller

    {

        public ActionResult Login()

        {

            return View();

        }

        public JsonResult GetInfo()

        {

            return Json(new

            {

                time = DateTime.Now.ToString(),

                flag=new Info[] { new Info { Name="小明",Age= },new Info { Name="小秋",Age= } }

            },JsonRequestBehavior.AllowGet);

        }

    }

    public class Info

    {

        public string Name { get; set; }

        public int Age { get; set; }

    }

Info类是一个实体模型，主要是让返回的json字符串复杂一点，嘿嘿。

好了，后台完了，下面就分别给出两种不同的处理方法

一：jQuery AJAX:

　　

<!DOCTYPE html>
<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Login</title>

    <script src="~/scripts/jquery-2.1.4.js"></script>

    <script src="~/scripts/jquery.unobtrusive-ajax.js"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            $("#get").click(function () {

                $.ajax({

                    cache:false,

                    type: "get",
                    dataType:"json",

                    url: "getinfo",

                    success: function (data, textStatus) {

                        $("#main").html(data.time);

                        var bodyTag=$("body");

                        bodyTag.append("<table>");

                        $.each(data.flag, function () {

                            $("body").append("<tr><td>"+this.Name+"</td><td>"+this.Age+"</td></tr>");

                        })

                        bodyTag.append("</table>");

                    }

                });

            })

        })
</script>

</head>

<body><input type="button" id="get" value="获取信息" /><div id="main"></div>

</body>

</html>

在上面的jQuery代码中，我在dom完成加载后，给id为“get”的按钮注册了一个点击事件，点击该按钮后会发起ajax请求，请求的方式为get,返回数据类型为json格式，然后再请求成功success的回调函数中我用了一些jquery的方法操作dom,把返回的数据显示出来。

以上就是用直接调用jQuery AJAX的方法，至于ajax的请求参数我们可以任意修改，留个参考网址：http://www.jquery123.com/jQuery.ajax/

二：利用AJAXHelper

@model WebApplication1.Models.UserViewModel

@{

    Layout = null;

}

<!DOCTYPE html>

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Login</title>

    <script src="~/scripts/jquery-2.1.4.min.js"></script>

    <script src="~/scripts/jquery.unobtrusive-ajax.js"></script>

    <script type="text/javascript">

        function OnSuccess(data) {

            var main = document.getElementById("main");

            var table = document.createElement("table");

            for (var i = 0; i < data.flag.length; i++) {

                var tr = document.createElement("tr");

                tr.innerHTML = "<td>" + data.flag[i].Name + "</td>" + "<td>" + data.flag[i].Age + "</td>";

                table.appendChild(tr);

            }

            main.appendChild(table);

        }

    </script>

</head>

<body>

    @using (Ajax.BeginForm("getinfo",new AjaxOptions {OnSuccess= "OnSuccess", HttpMethod="Get", AllowCache=false}))

    {

        <input type="submit" id="get" value="获取信息" />

    }

   <div id="main">

    </div>

</body>

</html>

using的目的在于让表单标签闭合，可以看到AJAXHelper发起ajax请求也是比较简单。和jQuery AJAX直接操作没有区别，不过vs的智能提示还是不错的。这个只有在AJAXHelper中可以体验到。

总结：两种都能完成AJAX请求，但是AJAXHelper和jQuery AJAX是有区别的。具体区别等我研究通了再来记录。嘿嘿

做demo过程中遇到的几个问题：

1.当一个Action返回JsonResult类型时候，Json()方法如果不加JsonRequestBehavior.AllowGet参数，当用get方法请求时会发生500错误。

2.在dom中操作json字符串时候，注意大小写。

【Asp.net MVC】AJAXHelper 和jQueryAjax的更多相关文章

  1. asp.net mvc AjaxHelper 获取 JSON 的方法

    默认的 AjaxHelper 没有提供获取 JSON 的方法,只提供获取 html 然后更新指定元素的方法,不过,经测试发现还是有办法的,由于 AjaxOptions 对象的 OnSuccess 属性 ...

  2. 仅此一文让你明白ASP.NET MVC 之View的显示（仅此一文系列二）

    题外话 一周之前写的<仅此一文让你明白ASP.NET MVC原理>受到了广大学习ASP.NET MVC同学的欢迎,于是下定决心准备把它写成一个系列,以满足更多求知若渴的同学们.蒋金楠老师已 ...

  3. 应用程序框架实战三十三:表现层及ASP.NET MVC介绍（二）

    最近的更新速度越来越慢,主要是项目上比较忙,封装EasyUi也要花很多时间.不过大家请放心,本系列不会半途夭折,并且代码干货也会持续更新.本文继续介绍表现层和Asp.net Mvc,我将在本篇讨论一些 ...

  4. 14、ASP.NET MVC入门到精通——Ajax

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 Unobtrusive Ajax使用方式(非入侵式) 非入侵式,通俗来讲:就是将嵌入在Html中的JavaScript全部取出来,放在单独的 ...

  5. Asp.Net MVC<八>：View的呈现

    ActionResult 原则上任何类型的响应都可以利用当前的HttpResponse来完成.但是MVC中我们一般将针对请求的响应实现在一个ActionResult对象中. public abstra ...

  6. ASP.NET MVC分页组件MvcPager 2.0版发布暨网站全新改版

    MvcPager分页控件是在ASP.NET MVC Web应用程序中实现分页功能的一系列扩展方法,该分页控件的最初的实现方法借鉴了网上流行的部分源代码, 尤其是ScottGu的PagedList< ...

  7. MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)

    该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...

  8. ASP.NET MVC运行机制源码剖析

    我们都知道ASP.NET首先是从Global.aspx中开始运行的, 在Application_Start()中添加路由映射后, 就由URLRouting组件创建IRouteHandler并执行, 在 ...

  9. ASP.NET MVC视图中的@Html.xxx(...)

    问题 在视图页中@Html.xxx(...)是什么?如何被执行? 如下图所示: 解疑 视图页中@Html.xxx(...)涉及的内容有: 视图页被编译后的类继承自 WebViewPage<T&g ...

随机推荐

  1. oracle中bulk collect into用法

    通过bulk collect减少loop处理的开销 采用bulk collect可以将查询结果一次性地加载到collections中. 而不是通过cursor一条一条地处理. 可以在select in ...

  2. 迷你MVVM框架 avalonjs 学习教程2、模块化、ViewModel、作用域

    一个项目是由许多人分工写的,因此必须要合理地拆散,于是有了模块化.体现在工作上,PM通常它这为某某版块,某某频道,某某页面.某一个模块,必须是包含其固有的数据,样式,HTML与处理逻辑.在jQuery ...

  3. 【Java】JavaIO(一)、基础知识

    一.常用概念介绍 Java的IO,实现输入输出的基础,可以方便的实现数据的输入输出 二.流的分类 1. 按照流向来分: a). 输入流:向应用程序输 b). 输出流:从应用程序中输出 输入输出流是站在 ...

  4. fabric本地一键部署LAMP

    一.添加普通用户jeff执行sudo时无需输入密码 $ sudo vim /etc/sudoers ---------------------------------------> ## All ...

  5. 什么是2MSL

    [什么是2MSL] MSL是Maximum Segment Lifetime英文的缩写,中文可以译为“报文最大生存时间”,他是任何报文在网络上存在的最长时间,超过这个时间报文将被丢弃.因为tcp报文( ...

  6. Unity5.x Reflection Probe反射探针

    http://blog.csdn.net/yupu56/article/details/53487216

  7. Shiro01 功能点框图、架构图、身份认证逻辑、身份认证代码实现

    基本功能点 功能点框图 功能点说明 1.Authentication:身份认证/登录,验证用户是不是拥有相应的身份: 2.Authorization:授权,即权限验证,验证某个已认证的用户是否拥有某个 ...

  8. jQuery的选择器的总结

    一.简单选择器 // $(function () { // $("#box").css("color","red") // }) // 这个 ...

  9. 电话号码的字母组合 · Letter Combinations of a Phone Number

    ［抄题］: Given a digit string excluded 01, return all possible letter combinations that the number coul ...

  10. C和C++中的不定参数

    在初学C的时候,我们都会用到printf函数来写Hello World的程序.在我们看printf函数的声明时,会看到类似于下面代码 int printf(const char * __restric ...