1. Models
public class Citys
{
public int Id { get; set; }
public string CityName { get; set; }
public int ZipCode { get; set; }
}
2. Controller
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
} public ActionResult GetJsonCitys(int? secho)
{
var cityList = new List<Citys>();
for (int i = ; i < ; i++)
{
cityList.Add(new Citys
{
Id = i,
CityName = Guid.NewGuid().ToString(),
ZipCode = DateTime.Now.Millisecond
});
} var objs = new List<object>();
foreach (var city in cityList)
{
objs.Add(GetPropertyList(city).ToArray());
}
return Json(new
{
sEcho = secho,
iTotalRecords = cityList.Count(),
aaData = objs
}, JsonRequestBehavior.AllowGet);
} private List<string> GetPropertyList(object obj)
{
var propertyList = new List<string>();
var properties = obj.GetType().GetProperties(BindingFlags.Instance | BindingFlags.Public);
foreach (var property in properties)
{
object o = property.GetValue(obj, null);
propertyList.Add(o == null ? "" : o.ToString());
}
return propertyList;
}
}
3. Views
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>Index</title>
<link href="@Url.Content("~/Style/demo_page.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Style/jquery-ui-1.8..custom.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Style/demo_table_jui.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.4..min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/Plug-in/jquery.dataTables.js")" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$('#DataTable').dataTable({
"oLanguage": {//语言国际化
"sUrl": "/Scripts/Plug-in/jquery.dataTable.cn.txt"
},
"bJQueryUI": true,
"sPaginationType": "full_numbers",
'bPaginate': true, //是否分页。
"bProcessing": true, //当datatable获取数据时候是否显示正在处理提示信息。
"bServerSide": false,
"sAjaxSource": "Home/GetJsonCitys",
"aoColumns": [
{ "sTitle": "编号", "sClass": "center" },
{ "sTitle": "城市名称", "sClass": "center" },
{ "sTitle": "邮政编码", "sClass": "center" },
{
"sTitle": "操作",
"sClass": "center",
"fnRender": function (obj) {
return '<a href=\"Details/' + obj.aData[] + '\">查看详情</a> <input tag=\"' + obj.aData[] + '\" type=\"checkbox\" name=\"name\" />';
}
}
]
});
});
//aoColumns 参数用来定义表格的列，这是一个数组，其中的每一个对象用来定义一列。
//对于每一个列对象： sTitle 定义列的标题 sClass 定义列的样式
//fnRender 函数用来渲染列，这个函数将会传递一个参数对象，这个参数对象的 iDataColumn 属性表示当前的列索引，aData 表示当前的行数组。函数返回的结果将被填充到单元格中。
//当然了，对于表示行的数组来说，长度应该是相同的。如果某一行数据缺失或者提供了过多地数据的话，就会得到一个警告。
</script>
</head>
<body style="font-size: 12px;">
<table class="display" id="DataTable">
<thead>
<tr>
<th>
Id
</th>
<th>
CityName
</th>
<th>
ZipCode
</th>
<th>
操作
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
例子下载:
http://down.51cto.com/data/892223
在ASP.NET MVC中使用JQ插件datatable的更多相关文章
-
ASP.NET MVC 中使用 AjaxFileUpload 插件时，上传图片后不能显示（预览）
AjaxFileUpload 插件是一个很简洁很好用的上传文件的插件,可以实现异步上传功能,但是在 ASP.NET MVC中使用时,会出现上传图片后不能正确的显示的问题,经过仔细排查,终于找到原因,解 ...
-
在Asp.Net MVC中使用NPOI插件实现对Excel的操作（导入，导出，合并单元格，设置样式，输入公式）
前言 NPOI 是 POI 项目的.NET版本,它不使用 Office COM 组件,不需要安装 Microsoft Office,目前支持 Office 2003 和 2007 版本. 1.整个Ex ...
-
[Asp.net mvc]Asp.net mvc 中使用LocalStorage
目前使用比较多的本地存储方案有比如Flash SharedObject.Google Gears.Cookie.LocalStorage.User Data.Open Database等方案.综合比较 ...
-
如何在 ASP.NET MVC 中集成 AngularJS（2）
在如何在 ASP.NET MVC 中集成 AngularJS(1)中,我们介绍了 ASP.NET MVC 捆绑和压缩.应用程序版本自动刷新和工程构建等内容. 下面介绍如何在 ASP.NET MVC 中 ...
-
如何在 ASP.NET MVC 中集成 AngularJS（1）
介绍 当涉及到计算机软件的开发时,我想运用所有的最新技术.例如,前端使用最新的 JavaScript 技术,服务器端使用最新的基于 REST 的 Web API 服务.另外,还有最新的数据库技术.最新 ...
-
Asp.net mvc 中View 的呈现(二)
[toc] 上一节介绍了 Asp.net mvc 中除 ViewResult 外的所有的 ActionResult,这一节介绍 ViewResult. ViewResultBase ViewResul ...
-
Vue在ASP.NET MVC中的进行前后端的交互
Vue在ASP.NET MVC中的进行前后端的交互 Preface: 由于最近在研究前端相关的技术,作为前端非常优秀的框架Vue,个人在学习的过程中遇到一些问题,网上相关资料有限,所以在这这里总结一下 ...
-
在ASP.NET MVC中实现区域或城市选择
每次在"万达影城"网上购票总会用到左上角选择城市的功能.如下: 今天就在ASP.NET MVC中实现一下.我想最好的方式应该是写一个插件,但自己在这方面的功力尚欠缺,如果大家在这方 ...
-
C# 动态生成word文档 [C#学习笔记3]关于Main(string[ ] args)中args命令行参数 实现DataTables搜索框查询结果高亮显示 二维码神器QRCoder Asp.net MVC 中 CodeFirst 开发模式实例
C# 动态生成word文档 本文以一个简单的小例子,简述利用C#语言开发word表格相关的知识,仅供学习分享使用,如有不足之处,还请指正. 在工程中引用word的动态库 在项目中,点击项目名称右键-- ...
随机推荐
-
TCP/IP连接状态
1.建立连接协议(三次握手)(1)客户端发送一个带SYN标志的TCP报文到服务器.这是三次握手过程中的报文1.(2) 服务器端回应客户端的,这是三次握手中的第2个报文,这个报文同时带ACK标志和SYN ...
-
Robot Framework入门学习1 安装部署详解
安装注意: 目前Robot framework-ride不支持python3,安装时请下载python2.7版本. Robot Framework安装时出现了一点小问题,网上没有找到直接的介绍,现将安 ...
-
rel=";stylesheet"; 描述
<link type="text/css" rel="stylesheet" href="css/style.css"/> re ...
-
hdu 5265 pog loves szh II STL
pog loves szh II Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php? ...
-
sicily 1010. 单词数值
本题主要是Hash思想的应用 课程上机练习题 Contest ends in 8 months 27 days
-
sass笔记-2|Sass基础语法之让样式表更具条理性和可读性
这一篇主要详述保持sass条理性和可读性的3个最基本方法--嵌套.导入和注释. 零. 变量 变量本身的作用是为了保持属性值的可维护性,把所有需要维护的属性值放在同一个地方,快速更改,处处生效,可谓售后 ...
-
angular 实现modal windows效果（即模态窗口，半透明的遮罩层），以及bootstrap(css,components,js)的初步学习
废话不说,直接上代码.可直接看效果,对着分析..今天算是bootstrap 入门了,开心.. 突然居然很多事情就是那样,不要太多的畏惧,迈出第一步其实就成功了一半了. <html ng-app= ...
-
Struts2(一)基本配置
一.Struts2概述 1.什么是Struts2? Struts2以WebWork为核心,采用拦截器的机制来处理用户的请求,这样使得业务逻辑控制器能够和ServletAPI脱离开来. 2.工作原理 当 ...
-
arch安装完成之后不能使用笔记本自带的无线网卡
问题描述如下 我笔记本的wifi网卡识别不了,不知道为什么?? 使用ifconfig -a 只列出了有线网卡以及外接的无线网卡如下 enp4s0f1: flags=<UP,BROADCAST,M ...
-
基于NABCD评论“探路者”Alpha版作品
1.分析 N(Need):”为了重温贪吃蛇这一经典游戏,本组的选题定为贪吃蛇游戏,并在此基础上进行了新的创新,将普通的贪吃蛇游戏改为单词版贪吃蛇.市面上的英语单词背记软件对于那些缺少英语学习兴趣.毅力 ...