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

后台的数据格式:

    public class ViewModel
{
public int ID { get; set; } public string Name { get; set; } public List<string> Data { get; set; }
}

Controller 传递到View的数据:

        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 中的一个对象

    var viewModel = {
id: 0,
name: '',
data:[]
}

  

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

<script>
viewModel.id=@ViewBag.ID;
or
viewModel.id=@Model.ID;
</script>

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

<script>
viewModel.name='@ViewBag.Name';
or
viewModel.name='@Model.Name';
</script>

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

<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

 

MVC后台数据赋值给前端JS对象的更多相关文章

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

    @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...

  2. Asp.Net Mvc后台数据验证自测小Demo

    使用过MVC的同学一定不陌生MVC的模型绑定和模型校验,使用起来非常方便,定义好Entity之后,在需要进行校验的地方可以打上相应的Attribute,在Action开始时检查ModelState的I ...

  3. 前端JS模版库kino.razor - 原理流程分析 - 改进版轮子RazorJs

    1.前言 从后台获取数据,在前端JS里面拼接字符串,不累吗?敢不敢找一款前端使使... 现在这种模板库比较多了,我用过的jquery-template .JsRender .听说过的一堆,还有各种MV ...

  4. JS对象与json字符串格式

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  5. jQuery实现的分页功能,包括ajax请求,后台数据,有完整demo

    一:需求分析 1)需要首页,末页功能 2)有点击查看上一页,下一页功能 3)页码到当前可视页码最后一页刷新页面 二:功能实现思路 也是分为三部分处理 1)点击首页,末页直接显示第一页或者最后一页内容, ...

  6. jquery对象和js对象

    <ul id="ul1">   <li id="li_1">01</li>   <li>02</li> ...

  7. php如何优雅地把数组传递给前端js脚本?

    比如说http://echarts.baidu.com/demo...这个例子中,一般里面的timeData数组都是数据库的所有记录的单独某一个列的集合,而例子中第149行的 data:[ 1,2,3 ...

  8. 腾讯云图片鉴黄集成到C# SQL Server 怎么在分页获取数据的同时获取到总记录数 sqlserver 操作数据表语句模板 .NET MVC后台发送post请求 百度api查询多个地址的经纬度的问题 try{}里有一个 return 语句,那么紧跟在这个 try 后的 finally {}里的 code 会 不会被执行,什么时候被执行,在 return 前还是后? js获取某个日期

    腾讯云图片鉴黄集成到C#   官方文档:https://cloud.tencent.com/document/product/641/12422 请求官方API及签名的生成代码如下: public c ...

  9. Asp.net MVC 传递数据 从前台到后台,包括单个对象,多个对象,集合

    今天为大家分享下 Asp.net MVC 将数据从前台传递到后台的几种方式. 环境:VS2013,MVC5.0框架 1.基本数据类型 我们常见有传递 int, string, bool, double ...

随机推荐

  1. JS中的split

    个人理解spilt函数是javascript中字符串和正则表达式的一个联合应用.功能是根据指定的正则表达式(如果是字符串的话也会转为正则表达式)对字符串进行分割.返回值是一个被分割后的字符串数组. 最 ...

  2. jQuery中时间戳和日期的相互转换

    在项目中经常会使用时间戳和日期的相互转换,可以参考如下代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 2 ...

  3. JVM内存模型与性能调优

    堆内存(Heap) 堆是由Java虚拟机(JVM,下文提到的JVM特指Sun hotspot JVM)用来存放Java类.对象和静态成员的内存空间,Java程序中创建的所有对象都在堆中分配空间,堆只用 ...

  4. 在 Visual Studio 中调试时映射调用堆栈上的方法

    本文转自:https://msdn.microsoft.com/zh-cn/library/dn194476.aspx 1.创建代码图,以便在调试时对调用堆栈进行可视化跟踪. 你可以在图中进行标注以跟 ...

  5. 移动端自动化环境搭建-RIDE的安装

    A.安装依赖 RIDE 是 Robot Framework 测试数据的编辑器.它使测试用例的创建.运行.测试项目的组织可以在图形界面下完成. B.安装过程 下载地址:https://pypi.pyth ...

  6. 监听JVM的几个命令(可用于linux 本机)

    1. jstat 这个命令对于查看Jvm的堆栈信息很有用.能够查看eden,survivor,old,perm等heap的capacity,utility信息 对于查看系统是不是有能存泄漏以及参数设置 ...

  7. TeXmacs 中输入狄拉克 braket 符号

    TeXmacs的数学模式下,默认会对括号进行自动补齐.这也导致输入狄拉克 braket 符号时得到的可能不是你想要的结果.经测试,可用以下输入方式输入 (以下 _ 表示光标所在位置,Tab代表Tab键 ...

  8. 第六百一十二、三、四、五天 how can I 坚持

    上火了啊..已经2017了,真快,人生只是一瞬间,到头来都是一场空. 2016年最后一天,很悲催,没赶上火车.还不能改签,哪能哪次都这么幸运,长记性了,下午到济南,看了看弟弟的房子,到挺不错,就是装修 ...

  9. mapreduce出现类似死锁情况

    在往hbase表里通过bulkload导数据时,某个mapreduce跑了一个多小时还没跑,看yarn界面,发现map还有一小部分没跑完,没跑完的map全在pending,running中没有,同时r ...

  10. oracle的游标

    declare v_0 number; v_1 number; cursor c1 is select productordernumber from his_productorder@pro_crm ...