Datagrid接收JSON数据格式
开打View下面的Shared创建一个视图模版(母版页)
<!DOCTYPE html>
<html>
<head>
<title>Main</title> <script src="@Url.Content("~/Scripts/jquery.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.easyui.min.js")" type="text/javascript"></script>
@Styles.Render("~/Content/css")
@Styles.Render("~/Content/themes/blue/css")
</head>
<body>
<div style="padding:5px 5px 0px 5px;">
@RenderBody()
</div>
</body>
</html>
index视图
@using App.Admin;
@using App.Common;
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Index_Layout.cshtml"; }
<table id="List"></table>
<script type="text/javascript">
$(function () {
$('#List').datagrid({
url: '/SysSample/GetList',
width: $(window).width() - 10,
methord: 'post',
height: $(window).height() -35,
fitColumns: true,
sortName: 'Id',
sortOrder: 'desc',
idField: 'Id',
striped: true, //奇偶行是否区分
singleSelect: true,//单选模式
rownumbers: true,//行号
columns: [[
{ field: 'Id', title: 'ID', width: 80 },
{ field: 'Name', title: '名称', width: 120 },
{ field: 'Age', title: '年龄', width: 80, align: 'right' },
{ field: 'Bir', title: '生日', width: 80, align: 'right' },
{ field: 'Photo', title: '照片', width: 250 },
{ field: 'Note', title: '说明', width: 60, align: 'center' },
{ field: 'CreateTime', title: '创建时间', width: 60, align: 'center' }
]]
});
});
</script> 在SysSampleController添加GetList方法给视图的AJAX使用
[HttpPost]
public JsonResult GetList()
{
List<SysSampleModel> list = m_BLL.GetList("");
var json = new
{
total = list.Count,
rows = (from r in list
select new SysSampleModel()
{
Id = r.Id,
Name = r.Name,
Age = r.Age,
Bir = r.Bir,
Photo = r.Photo,
Note = r.Note,
CreateTime = r.CreateTime,
}).ToArray()
};
return Json(json, JsonRequestBehavior.AllowGet);
}

其实有心的童鞋会发现下载的easyui包里面有个demo文件,我们打开datagrid样例的文件夹找到
{"total":28,"rows":[
{"productid":"FI-SW-01","productname":"Koi","unitcost":10.00,"status":"P","listprice":36.50,"attr1":"Large","itemid":"EST-1"},
{"productid":"K9-DL-01","productname":"Dalmation","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Spotted Adult Female","itemid":"EST-10"},
{"productid":"RP-SN-01","productname":"Rattlesnake","unitcost":12.00,"status":"P","listprice":38.50,"attr1":"Venomless","itemid":"EST-11"},
{"productid":"RP-SN-01","productname":"Rattlesnake","unitcost":12.00,"status":"P","listprice":26.50,"attr1":"Rattleless","itemid":"EST-12"},
{"productid":"RP-LI-02","productname":"Iguana","unitcost":12.00,"status":"P","listprice":35.50,"attr1":"Green Adult","itemid":"EST-13"},
{"productid":"FL-DSH-01","productname":"Manx","unitcost":12.00,"status":"P","listprice":158.50,"attr1":"Tailless","itemid":"EST-14"},
{"productid":"FL-DSH-01","productname":"Manx","unitcost":12.00,"status":"P","listprice":83.50,"attr1":"With tail","itemid":"EST-15"},
{"productid":"FL-DLH-02","productname":"Persian","unitcost":12.00,"status":"P","listprice":23.50,"attr1":"Adult Female","itemid":"EST-16"},
{"productid":"FL-DLH-02","productname":"Persian","unitcost":12.00,"status":"P","listprice":89.50,"attr1":"Adult Male","itemid":"EST-17"},
{"productid":"AV-CB-01","productname":"Amazon Parrot","unitcost":92.00,"status":"P","listprice":63.50,"attr1":"Adult Male","itemid":"EST-18"}
]}
我们看到示例中的Demo Json格式,后台必须返回符合Easyui读取的Json格式数

Datagrid接收JSON数据格式的更多相关文章
- EasyUI + ajax + treegrid/datagrid 接收 json 数据,显示树状/网状表结构
最后一更了,时间间隔有点久了~~ EasyUI作为一个成熟的前端框架,封装了ajax,对于数据的处理配合datagrid组件的使用,使其非常适合后台管理界面的开发(目前来说界面有点过时了). 通过aj ...
- spring接收json格式的多个对象参数(变通法)
两种方法 方法1 如果使用spring mvc同客户端通信,完全使用json数据格式,需要如下定义一个RequestMapping @Controller public class TestContr ...
- MyEclipse开发JAX-RS架构WebServices收发JSON数据格式
最近因项目需求,开始学习WebServices. 1.开发环境: MyEclipse2013 2.客户端发送的JSON数据格式为 {persons:[{"name":"a ...
- ThinkPHP中使用ajax接收json数据的方法
本文实例讲述了ThinkPHP中使用ajax接收json数据的方法.分享给大家供大家参考.具体分析如下: 这里通过ThinkPHP+jquery实现ajax,扩展了下,写了个查询,前台代码如下: 首先 ...
- 一、Ajax 二、JSON数据格式 三、Ajax+Jquery 四、分页的实现
一.Ajax概述###<1>概述 ###<2>组成 以XMLHttpRequest为核心,发送Ajax请求和接收处理结果 以javascript为语言基础 以XML/JSON作 ...
- AJAX发送json,SpringMVC 接收JSON,@RequestBody
需求:JQuery ajax前台,采用 POST请求 发送json,后台使用SpringMVC接收json并处理 前台: $.ajax({ url:"请求地址", type:&qu ...
- XML和JSON数据格式对比
概念 XML 扩展标记语言 (Extensible Markup Language, XML) ,用于标记电子文件使其具有结构性的标记语言,可以用来标记数据.定义数据类型,是一种允许用户对自己的标记语 ...
- VS快速生成JSON数据格式对应的实体
有固定好的Json数据格式,你还在手动敲对应的实体吗?有点low了!步入正题,这是一个json字符串,先去验证JSON数据格式(http://www.bejson.com/)如下: { & ...
- jQuery EasyUI:根据数据库内容生成适合于easyui-tree的JSON数据格式
1,jQuery EasyUI中easyui-tree特定的JSON数据格式 [ {"id":1,"text":"某公司","ch ...
随机推荐
- Canvas标签
1.Canvas标签: HTML5<canvas>元素用于图形的绘制,通过脚本(通常是javascript)来完成<canvas>标签只是图形容器,必须使用脚本来绘制图形.你可 ...
- Python面向对象之文件操作
文件的概念 文件的概念和作用 计算机的文件,就是存储在某种长期存储设备上的一段数据:长期存储设备包括:U盘,硬盘,移动硬盘,光盘,等: 文件的作用:将数据长期保存,在需要的时候使用: 文件的存储方式 ...
- Couchbase IV(管理与维护)
Couchbase IV(管理与维护) 管理 常用命令 Command Description server-list List all servers in a cluster server-inf ...
- C#与Ranorex自动化公用方法
原创 - C#与Ranorex自动化公用方法 利用c#在Ranorex上写自动化已经有很长的一段时间了,总结发现常用的方法不外乎如下几种: 1.打开浏览器:或者app public static vo ...
- FZU-2147-2147 A-B Game,规律题。。
Problem 2147 A-B Game Time Limit: 1000 mSec Memory Limit : 32768 KB Problem Description Fat brother ...
- ubuntu 18.04取消自动锁屏以及设置键盘快捷锁屏
1:操作设置取消自动锁屏: setting-->power--->never 2: 设置自动锁屏快捷键: 快捷键设置一般在setting-->devices--->keybo ...
- Couriers(bzoj 3524)
Description 给一个长度为n的序列a.1≤a[i]≤n.m组询问,每次询问一个区间[l,r],是否存在一个数在[l,r]中出现的次数大于(r-l+1)/2.如果存在,输出这个数,否则输出0. ...
- unbuntu下安装多个JAVA JDK版本及如何切换
当前环境已经安装过jdk1.6.0_45安装JDK 1.7.x时,若安装错误,可执行以下步骤:sudo add-apt-repository ppa:openjdk-r/ppa sudo apt-ge ...
- C#的特性学习草稿
原文发布时间为:2008-11-22 -- 来源于本人的百度文章 [由搬家工具导入] 举个简单的例子: 先定义个特性 从Attribute继承,并标明用法 [AttributeUsage(Attrib ...
- oc温习八:static、extern、const 的了解
参考文章:http://www.cocoachina.com/ios/20161110/18035.html 1.const 这个单词翻译成中文是“常量”的意思.在程序中我们知道“常量”的值是不能变的 ...