码迷,mamicode.com
首页 > Web开发 > 详细

ASP.NET MVC中如何以ajax的方式在View和Action中传递数据

时间:2015-07-28 00:32:39      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:

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

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

1,前台HTML代码:

技术分享
1     <div>
2         <button type="button" id="btn">从视图向控制器中传递数据</button>
3         <p id="info"></p>
4     </div>
View Code

2,前台JS代码:

技术分享
 1         $("#btn").click(function() {
 2             $.ajax({
 3                 async:true,
 4                 type: "POST",
 5                 url: "/AjaxTest/AjaxBackData",
 6                 cache: false,
 7                 data: {
 8                     Name: "SharpL", City: "北京", Age: 18
 9                 },
10                 success: function (result) {
11                     $("#info").text(result);
12                 }
13             });
14         });
View Code

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

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

或者JS代码这样来写:

技术分享
 1     $(function () {
 2         $("#btn").click(function () {
 3             var data = "";
 4             data += "&Name=" +encodeURI("SharpL");
 5             data += "&Age=" + encodeURI(18);
 6             data += "&City=" + encodeURI("北京");
 7             $.ajax({
 8                 async:true,
 9                 type: "POST",
10                 url: "/AjaxTest/AjaxBackData",
11                 cache: false,
12                 data: data,
13                 success: function (result) {
14                     $("#info").text(result);
15                 }
16             });
17         });
18     });
View Code

二者的结果完全相同。

3,后台代码如下:

技术分享
1         public ActionResult AjaxBackData(STU stu)
2         {
3             string name = stu.Name;
4             int age = stu.Age;
5             string city = stu.City;
6             string tmp=string.Format("{0}年龄{1}岁,来自{2}",name,age,city);
7             return Content(tmp);
8         }
View Code

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

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

技术分享
1         public ActionResult AjaxBackData()
2         {
3             var stu = new STU();
4             this.UpdateModel(stu);
5             string tmp=string.Format("{0}年龄{1}岁,来自{2}",stu.Name,stu.Age,stu.City);
6             return Content(tmp);
7         }
View Code

。。。

当然不一定要以Content的方式,返回处理后的结果给View,但是我的脖子实在是太疼了,所以先去睡觉了



ASP.NET MVC中如何以ajax的方式在View和Action中传递数据

标签:

原文地址:http://www.cnblogs.com/SharpL/p/4681596.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!