MVC后台数据赋值给前端JS对象

转载 2016年08月31日 14:10:12

Controller中的数据,不管是使用的是ViewModel 还是ViewBag.Data,要将他传递到View中,这个很容易,但是如果要将它传递给JS中的某个对象,这个改如何处理呢?

后台的数据格式:

1
2
3
4
5
6
7
8
public class ViewModel
{
    public int ID { getset; }
 
    public string Name { getset; }
 
    public List<string> Data { getset; }
}

Controller 传递到View的数据:

1
2
3
4
5
6
7
8
9
10
11
12
public ActionResult Index()
{
    ViewBag.ID = 1;
    ViewBag.Name = "WWW";
    ViewModel viewModel = new ViewModel()
    {
        ID = 100,
        Name = "WWW",
        Data = new List<string> {"A","B","C","D","E" }
    };
    return View(viewModel);
} 

前台JS 中的一个对象

1
2
3
4
5
var viewModel = {
    id: 0,
    name: '',
    data:[]
}

  

1. 如果需要传递整形数字到JS中 

1
2
3
4
5
<script>
        viewModel.id=@ViewBag.ID;
        or
        viewModel.id=@Model.ID;
</script>

2.  如果需要传递字符串到JS中

1
2
3
4
5
<script>       
        viewModel.name='@ViewBag.Name';
        or
        viewModel.name='@Model.Name'
</script> 

3.如果需要传递复杂的数据类型到JS中,如对象,数组,集合等,

1
2
3
<script>
        viewModel.data = @Html.Raw(Json.Encode(Model.Data));
</script>

 

更多方法请参见:http://stackoverflow.com/questions/3850958/pass-array-from-mvc-to-javascript

另外将JS 中的对象传递到Controller中,这个直接采用Ajax,就可以实现,详细请参见  http://stackoverflow.com/questions/16824773/passing-an-array-of-javascript-classes-to-a-mvc-controller

 

js与mvc 数据的交互

在做考试系统中,遇到最头疼的问题,就是前台与后台的交互。对于使用easyui来说,刚接触不久,有点陌生。     查着文档,看着Demo。做起来着实有点头疼。       首先,前台使用的是MVC+...

MVC 从控制器将数据对象赋值给前端JS对象

@{ Layout = null; } 示例 //将数据对象转换为 JSON 格式,是为了在网页中通过使用JS将数据作为文本进行处...

mvc js获取页面model里的值

方法1: $("#Province").val('@Model.Province'); 方法2: 将MODEL的值赋给hidden通过JS获取...
  • linybo
  • linybo
  • 2015年05月05日 19:14
  • 8270

十、MVC模式中的Model使用方法

model是MVC里的M,它是MVC里最简单而又复杂的部分,简单是因为有了它你就不必关注数据层,让你把精力集中在业务逻辑,说它复杂是因为要想实现这样的机制是比较困难的,好在symfony2帮我们实现了...

前端web开发的MVC模式 - 从一个简单实例讲起

前端web开发的MVC模式 - 从一个简单实例讲起 MVC概论起初来之桌面应用开发。其实java的structs框架最能体现MVC框架:model模型是理解成服务器端的模块程序;view为发送给...

JAVASCRIPT的MVC示例

/** * The Model. Model stores items and notifies * observers about changes. */ function ListModel...

MVC4的一些前后台数据传递方法

后台:ViewBag.varible = "data" -->一般传递基本类型 前台:@ViewBag.varible 后台:ViewData["varible"] = object -->传递...

ASP.NET MVC3中Controller与View之间的数据传递总结

在ASP.NET MVC中,经常会在Controller与View之间传递数据,因此,熟练、灵活的掌握这两层之间的数据传递方法就非常重要。本文从两个方面进行探讨: 1 Controller向View...
  • sknice
  • sknice
  • 2015年01月01日 22:59
  • 42915

springmvc和js前端的数据传递和接收方式

在springmvc中controller的结果集可通过json格式传到js前端接受,也可以通过Map传给前端,具体实现如下 1,通过json格式传递    controller层实现如下    ...
  • wushuchu
  • wushuchu
  • 2015年12月09日 13:46
  • 12619

SpringMVC前端传值到Controller与Controller中传值到View解析

第一种:@RequestParam 表示是必须的,如果没有传值就会报错 第二种:直接通过参数 从Controller中传值到前端View,通过Map就可以 ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:MVC后台数据赋值给前端JS对象
举报原因:
原因补充:

(最多只允许输入30个字)