前言:写这篇随笔的时候,在url上漏写了斜线,找了好久错误,整个人都很不好。#我是猪系列

背景:之前介绍过一篇如何构建 MVC&AJax&JSon示例,这一篇单独讲解如何在View和Action间传递并处理数据。

1,前台HTML代码:

     <div>
<button type="button" id="btn">从视图向控制器中传递数据</button>
<p id="info"></p>
</div>

2,前台JS代码:

         $("#btn").click(function() {
$.ajax({
async:true,
type: "POST",
url: "/AjaxTest/AjaxBackData",
cache: false,
data: {
Name: "SharpL", City: "北京", Age:
},
success: function (result) {
$("#info").text(result);
}
});
});

JS代码讲解:注意url: "/AjaxTest/AjaxBackData",AjaxTest前的‘/'千万不能漏掉,博主已经开始怀疑人生了。

     data: {Name: "SharpL", City: "北京", Age: 18},数据就是这样以匿名对象的方式传递过去的。

或者JS代码这样来写:

     $(function () {
$("#btn").click(function () {
var data = "";
data += "&Name=" +encodeURI("SharpL");
data += "&Age=" + encodeURI();
data += "&City=" + encodeURI("北京");
$.ajax({
async:true,
type: "POST",
url: "/AjaxTest/AjaxBackData",
cache: false,
data: data,
success: function (result) {
$("#info").text(result);
}
});
});
});

或者JS代码这样来写:

     $(function () {
$("#btn1").click(function () {
$.ajax({
type: "POST",
url: "/TestAjax/Test?City=北京&Name=SharpL&Age=18",
cache: false,
data: null,
success: function (result) {
if (result) {
$("#pDisplay").text("返回信息为 " + result.Message + "\n" + "随机数为" + result.RandomNum);
}
}
});
});
})

三者的结果完全相同。

3,后台代码如下:

         public ActionResult AjaxBackData(STU stu)
{
string name = stu.Name;
int age = stu.Age;
string city = stu.City;
string tmp=string.Format("{0}年龄{1}岁,来自{2}",name,age,city);
return Content(tmp);
}

注意Action的参数为STU,直接获取以ajax方式传递过来的数据。

或者后台代码如下:(项目中所使用的经典方式)

         public ActionResult AjaxBackData()
{
var stu = new STU();
this.UpdateModel(stu);
string tmp=string.Format("{0}年龄{1}岁,来自{2}",stu.Name,stu.Age,stu.City);
return Content(tmp);
}

或者后台代码如下:(以显示ContentResult的方式返回)前两种方式返回Content,其返回值仍然是ContentResult。

             var actionResult = default(ContentResult);
var stu =new Stu();
this.UpdateModel(stu);
actionResult=new ContentResult(){
Content=string.Format("{0}{1}岁,来自{2}",stu.Name,stu.Age,stu.City)
};
return actionResult;

Content只能够返回Content,当需要返回多项数据时,返回Json(),代码如下:

         public ActionResult Test()
{
var stu = new Stu();
this.UpdateModel(stu);
var tmp= string.Format("{0}{1}岁,来自{2}", stu.Name, stu.Age, stu.City);
Random r=new Random();
int t=r.Next(,);
return Json(new { Message = tmp, RandomNum = t });
}

2.2同时修改对于返回json格式的数据的前台Ajax接收的代码,修改如下:

                 success: function (result) {
if (result) {
$("#pDisplay").text("返回信息为 " + result.Message + "\n" + "随机数为" + result.RandomNum);
}
}

类似的,可以将Json修改为显式返回JsonResult对象,代码如下:

         public ActionResult Test()
{
var actionResult = default(JsonResult);
var stu = new Stu();
this.UpdateModel(stu);
var tmp= string.Format("{0}{1}岁,来自{2}", stu.Name, stu.Age, stu.City);
Random r=new Random();
int t=r.Next(,);
actionResult = new JsonResult()
{
Data = new { Message = tmp, RandomNum = t }
};
return actionResult;
}

出处:http://www.cnblogs.com/SharpL/p/4681596.html

ASP.NET MVC中如何以ajax的方式在View和Action中传递数据的更多相关文章

  1. [asp.net mvc 奇淫巧技] 01 - 封装上下文 - 在View中获取自定义的上下文

    我们在asp.net 开发中已经封装了最强大的HttpContext,我们可以在HttpContext中可以获取到几乎任何想获取的东西,也可以在HttpContext写入需要返回客户端的信息.但是这些 ...

  2. ASP.NET MVC WebGrid – Performing true AJAX pagination and sorting 【转】

    ASP.NET MVC WebGrid – Performing true AJAX pagination and sorting FEBRUARY 27, 2012 14 COMMENTS WebG ...

  3. [ASP.NET MVC] 利用动态注入HTML的方式来设计复杂页面

    原文:[ASP.NET MVC] 利用动态注入HTML的方式来设计复杂页面 随着最终用户对用户体验需求的不断提高,实际上我们很多情况下已经在按照桌面应用的标准来设计Web应用,甚至很多Web页面本身就 ...

  4. [asp.net mvc 奇淫巧技] 02 - 巧用Razor引擎在Action内生成Html代码

    在web开发中经常会遇到在内部代码中获取Html,这些Html是需要和数据进行一起渲染.并不是直接把Html代码返回给客户端.这样的做法有很多应用场景,例如分页.Ajax一次性获取几段Html片段.生 ...

  5. 【ASP.NET MVC】View与Controller之间传递数据

    1   概述 本篇文章主要从操作上简要分析Controller<=>View之间相互传值,关于页面之间传值,如果感兴趣,可参考我另外一篇文章ASP.NET 页面之间传值的几种方式 . Co ...

  6. 一步步学习ASP.NET MVC3 (5)——View从Action中获得数据

    请注明转载地址:http://www.cnblogs.com/arhat 在上一章中,我们把Razor的模板技术给大家介绍了一下,当然模板中还有其他的知识点,这个以后我们还会继续讲解.本章我们主要讨论 ...

  7. 【MVC架构】——怎样利用Json在View和Controller之间传递数据

    在MVC架构中,尽管非常多东西和三层非常相似,可是也有非常大的差别.就比方传递数据.在三层架构中,传递数据就仅仅要一层返回,另外一层用同样类型的变量来接收即可了.在MVC中,事实上原理是一样的,Con ...

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

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

  9. 转:ASP.Net MVC:校验、AJAX与过滤器

    原文地址:http://blog.jobbole.com/85005/ 一.校验 — 表单不是你想提想提就能提 1.1 DataAnnotations(数据注解) 位于 System.Componen ...

随机推荐

  1. python-day37--concurrent.futures模块 实现进程池与线程池

    1.concurrent.futures模块 直接内置就是 异步的提交   ,如果你想同步也可以实现(p.submit(task,i).result()即同步执行) 2.属性和方法: 1.submit ...

  2. dp练习(6)——搬运礼物

    3409 搬运礼物 CodeVS原创  时间限制: 1 s  空间限制: 64000 KB  题目等级 : 青铜 Bronze 题解       题目描述 Description 小浣熊松松特别喜欢交 ...

  3. 不能将Lnode * 类型的值分配到Lnode * 类型的实体

    typedef struct { int data; struct Lnode *next;}Lnode,*LinkList; 这个地方有点问题,因为结构体定义中出现了struct Lnode但 Ln ...

  4. Nginx 关于 location 的匹配规则详解

    有些童鞋的误区 1. location 的匹配顺序是“先匹配正则,再匹配普通”. 矫正: location 的匹配顺序其实是“先匹配普通,再匹配正则”.我这么说,大家一定会反驳我,因为按“先匹配普通, ...

  5. Docker安装及基础知识

    一.安装 & 启动 1.安装Docker [root@tokyo ~]# yum install docker 2.启动Docker服务 (1)旧式的 sysv 语法 [root@tokyo ...

  6. Bellman-Ford模板

    转载链接:http://blog.csdn.net/niushuai666/article/details/6791765 Dijkstra算法是处理单源最短路径的有效算法,但它局限于边的权值非负的情 ...

  7. Amaze UI 发布基于jQuery新版本v2.0.0之web组件

    首先Amaze Ui第一版时我收到邮件邀请去试用,去了官网看了下,是基于zepto.js的一个类似bootstrap的响应式框架,提到框架当然是好事,快速开发呗.这词2.0的弃用zepto.js改用j ...

  8. 安装淘宝cnpm镜像

    $ npm install -g cnpm --registry=https://registry.npm.taobao.org

  9. 第三视角团队:项目UML设计(团队)

    项目UML设计(团队) 团队信息 团队名:第三视角 各成员学号及姓名 姓名 学号 博客链接 张扬(组长) 031602345 http://www.cnblogs.com/sxZhangYang/p/ ...

  10. 【python】判断值是否在list和set的对比以及set的实现原理

    判断值是否在set集合中的速度明显要比list快的多, 因为查找set用到了hash,时间在O(1)级别. 假设listA有100w个元素,setA=set(listA)即setA为listA转换之后 ...