MVC后台数据赋值给前端JS对象
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对象的更多相关文章
- MVC 从控制器将数据对象赋值给前端JS对象
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...
- Asp.Net Mvc后台数据验证自测小Demo
使用过MVC的同学一定不陌生MVC的模型绑定和模型校验,使用起来非常方便,定义好Entity之后,在需要进行校验的地方可以打上相应的Attribute,在Action开始时检查ModelState的I ...
- 前端JS模版库kino.razor - 原理流程分析 - 改进版轮子RazorJs
1.前言 从后台获取数据,在前端JS里面拼接字符串,不累吗?敢不敢找一款前端使使... 现在这种模板库比较多了,我用过的jquery-template .JsRender .听说过的一堆,还有各种MV ...
- JS对象与json字符串格式
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...
- jQuery实现的分页功能,包括ajax请求,后台数据,有完整demo
一:需求分析 1)需要首页,末页功能 2)有点击查看上一页,下一页功能 3)页码到当前可视页码最后一页刷新页面 二:功能实现思路 也是分为三部分处理 1)点击首页,末页直接显示第一页或者最后一页内容, ...
- jquery对象和js对象
<ul id="ul1"> <li id="li_1">01</li> <li>02</li> ...
- php如何优雅地把数组传递给前端js脚本?
比如说http://echarts.baidu.com/demo...这个例子中,一般里面的timeData数组都是数据库的所有记录的单独某一个列的集合,而例子中第149行的 data:[ 1,2,3 ...
- 腾讯云图片鉴黄集成到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 ...
- Asp.net MVC 传递数据 从前台到后台,包括单个对象,多个对象,集合
今天为大家分享下 Asp.net MVC 将数据从前台传递到后台的几种方式. 环境:VS2013,MVC5.0框架 1.基本数据类型 我们常见有传递 int, string, bool, double ...
随机推荐
- iOS开发 GET、POST请求方法(NSURLSession篇)
NSURLConnection,在iOS9被宣布弃用,本文不使用NSURLConnection进行网络编程,有兴趣的童鞋可以参考: [iOS开发 GET.POST请求方法(NSURLConnectio ...
- ajax通讯之格式详解
前言: ajax的出现,一定程度上改变了js的命运,同时也被广泛使用,而jq的兴起也大大降低了ajax的使用难度.虽然,jq的ajax方法使用起来十分便利,但是大部分开发人员也仅仅只是对其中的几个属性 ...
- VLAN终结及三层子接口
VLAN终结是指trunk口与三层口连接时,三层口将VLAN tag去掉,VLAN终结于三层口中.为了让三层口能终结不同的VLAN,并且让VLAN间互通,引入了三层子接口的概念.假设HOST A与SW ...
- 稳定灵活的 HTML 列式布局
主要特点: 所有列轻松实现相同高度 兼容性极高 ------------------------------------------------ 代码 ------------------------ ...
- asp.net调用存储过程详解
摘要 存储过程的调用在B/S系统中用的很多.传统的调用方法不仅速度慢,而且代码会随着存储过程的增多不断膨胀,难以维护.新的方法在一定程度上解决了这些问题. 关键词 ASP.NET:存储过程 在使用 ...
- http://blog.csdn.net/shawnkong/article/details/52045894
http://blog.csdn.net/shawnkong/article/details/52045894
- Python 之Ajax
1.使用Ajax在后台传递参数的示例 要使用Ajax传递参数,需要使用jquery,使用jquery需要注意以下几点. 1.建立static的目录,将jquery导入 2.在项目s13day18_dj ...
- C# ADO.NET (sql语句连接方式)(增,删,改)
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We ...
- 超高性能的json序列化之MVC中使用Json.Net
先不废话,直接上代码 Asp.net MVC自带Json序列化 /// <summary> /// 加载组件列表 /// </summary> /// <param na ...
- SQL、Linq、lamda表达式 同一功能不同写法
一.SQL.Linq.lamda表达式 同一功能不同写法 SQL LINQ Lambda SELECT * FROM HumanResources.Employee from e in Employe ...