本文转自:http://blog.sina.com.cn/s/blog_48e42dc90100xp1p.html

二、开始实践 - jQuery端

假设我们要从服务器端获取一个文章列表,并把文章条目显示在页面中,而加载的过程要用ajax实现,即实现异步加载。那么我们先来完成jquery向服务器端发出ajax请求,并根据服务器响应来重组DOM从而实现文章在页面上显示。这里,和.NET MVC没有多大关系。具体的jquery代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
$.ajax({
url: '/cgi/getArtical', //请求的某个action的地址
datatype: "json", //只有指定为json下面才可以直接用返回的json数据,否则要转化
type: 'post',
success: function (data) {
PutArtical(data); //该函数中处理json格式的文章数据data;
HideTip(); //处理完文章后关闭加载提示
},
beforeSend: function(){
LoadTip("正在加载文章"); //这里是加载过程中的等待提示,可以自己定义
}
})

这是一个普通的jquery中ajax调用的例子,需要注意的是datatype最好指定为json,因为下面服务器端是直接返回json对象的,这样success中返回的数据就直接是json对象,可以直接使用;如果不这样指定的话也行,不过在success函数中必须先把data转换成json对象,转换方法是eval_r('('+data+')')。

三、开始实践 - .NET MVC服务器端

上面我们可以让jquery来调用action了,那么我们接下来就来写这个action,并把结果以json的格式返回给jquery,具体代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
/// <summary>
/// 返回文章列表
/// </summary>
/// <param name="name"></param>
/// <returns></returns>
[HttpPost]
public ActionResult getArtical()
{
List<Artical> artList = new List<Artical>();
artList.Add(new Artical(){ Id = 1,Title = "测试文章1" });
artList.Add(new Artical(){ Id = 2,Title = "测试文章2" });
return Json(artList); //MVC中可以用Json函数来将C#对象序列化成JSON对象
}

这个和以前普通的服务器代码不同的是最后我们可以非常方便地用Json函数将C#对象序列化成JSON对象并返回给jquery,代码十分简洁。

四、总结

在.NET MVC中使用jquery更加方便,jquery端只要我们指定返回的数据类型(datatype)为json就可以方便地使用服务器返回的json数据;服务器端我们可以用Json函数非常方便地将c#对象序列化成json对象而不必写一大堆的Response.Write("......")。本文到此结束!

[转]如何在.NET MVC中使用jQuery并返回JSON数据的更多相关文章

  1. 如何在.NET MVC中使用jQuery并返回JSON数据

    http://blog.csdn.net/dingxingmei/article/details/9092249 开始实践 - jQuery端 假设我们要从服务器端获取一个文章列表,并把文章条目显示在 ...

  2. jquery ajax返回json数据进行前后台交互实例

    jquery ajax返回json数据进行前后台交互实例 利用jquery中的ajax提交数据然后由网站后台来根据我们提交的数据返回json格式的数据,下面我来演示一个实例. 先我们看演示代码 代码如 ...

  3. Spring MVC 中 AJAX请求并返回JSON

    一.以ModelAndView的方式返回 先看下JavaScript代码: /** * 保存-同步(版本控制库) */ function saveSynchronizedVcHorse(obj) { ...

  4. Jquery,ajax返回json数据后呈现到html页面的$.post方式。

    ------------------------------------------------------完整版------------------------------------------- ...

  5. jquery $.post 返回json数据

    $(function () { $("#prompt").hide(); $("#searchIpt").keyup(function () { var key ...

  6. asp.net中webservice与android的json数据交互方式设置

    一 .服务器端设置 1.修改web.config 在web.config里面的的system.Web节点添加 <webServices> <protocols> <add ...

  7. asp.net mvc中使用jquery H5省市县三级地区选择控件

    地区选择是项目开发中常用的操作,本文讲的控件是在手机端使用的选择控件,不仅可以用于实现地区选择,只要是3个级别的选择都可以实现,比如专业选择.行业选择.职位选择等.效果如下图所示: 附:本实例asp. ...

  8. Spring MVC Controller与jquery ajax请求处理json

    在用 spring mvc 写应用的时候发现jquery传递的[json数组对象]参数后台接收不到,多订单的处理,ajax请求: "}]}]} $.ajax({ url : url, typ ...

  9. 使用jQuery解析JSON数据(由ajax发送请求到php文件处理数据返回json数据,然后解析json写入html中呈现)

    在上一篇的Struts2之ajax初析中,我们得到了comments对象的JSON数据,在本篇中,我们将使用jQuery进行数据解析. 我们先以解析上例中的comments对象的JSON数据为例,然后 ...

随机推荐

  1. js/jq基础(日常整理记录)-2-一个简单的js方法实现集合的非引用拷贝

    一.一个简单的js方法实现集合拷贝 做web项目的时候,少不了和js中的数组,集合等对象接触,那么你肯定会发现,在js中存在一个怪异的现象就是数组和集合的拷贝都是地址复制,并不是简单的数据的拷贝. 举 ...

  2. 关于webapi练习过程中遇到的一系列问题记录

    最近在尝试本地进行webapi调用的过程中,遇到一系列的问题,demo很小但着实让人头疼,先附上demo. 前台页面,目的是展示新闻的分类: 类别模型如下: 控制器代码如下: public Actio ...

  3. Win10下Tensorflow+GPU的环境配置

    不得不说,想要为深度学习提前打好框架确实需要花费一番功夫.本文主要记录了Win10下,Cuda9.0.Cudnn7.3.1.Tensorflow-gpu1.13.1.python3.6.8.Keras ...

  4. LINQ和Lambda表达式

    前言 前段时间接触了一种新的表达式,但是不知道这个是什么意思,所以就先站在巨人的肩膀用了,现在听师哥说这种写法是Lambda表达式.我一直以为,这个Lambda表达式和LINQ查询有异曲同工之妙,可惜 ...

  5. loj #108. 多项式乘法

    #108. 多项式乘法   题目描述 这是一道模板题. 输入两个多项式,输出这两个多项式的乘积. 输入格式 第一行两个整数 n nn 和 m mm,分别表示两个多项式的次数. 第二行 n+1 n + ...

  6. kuangbin专题十六 KMP&&扩展KMP HDU3347 String Problem(最小最大表示法+kmp)

    Give you a string with length N, you can generate N strings by left shifts. For example let consider ...

  7. js常用代码收集

    1. PC - js 返回指定范围的随机数(m-n之间)的公式 Math.random()*(n-m)+m return false return false // event.preventDefa ...

  8. CF 给你三个数字L, R, K,问在[L, R]范围内有多少个数字满足它每一位不同数字不超过k个,求出它们的和(数位DP)

    题意: 给你三个数字L, R, K,问在[L, R]范围内有多少个数字满足它每一位不同数字不超过k个,求出它们的和 分析:考虑用状态压缩 , 10给位0~9 , 如果之前出现过了某个数字x ,那就拿当 ...

  9. linux mysql下载地址

    linux mysql下载地址: https://dev.mysql.com/downloads/mysql/5.7.html#downloads

  10. python基础之1--Python入门

    第1章 Python生态圈 第2章 编程与编程语言 python是一门编程语言,作为学习python的开始,需要事先搞明白:编程的目的是什么?什么是编程语言?什么是编程? 2.1 编程的目的: 计算机 ...