在ASP.NET MVC中使用JQ插件datatable
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的动态库 在项目中,点击项目名称右键-- ...
随机推荐
- java中创建多线程的方式
在java中比较常用的有三种创建多线程的方式. 方式一:继承Thread类,要重写run方法. 在MyThread类 public class MyThread extends Thread { @O ...
- StartUML 各种类图的例子
1.UML分为: 1)静态建模:系统基础和系统固定框架结构,这些图形往往是“静态”的. 类图(Class Diagram):常用来分析业务概念 用例图(Use Case Diagram):常用 对象图 ...
- Delphi天气预报查询
Delphi天气预报查询 天气预报接口api(中国天气网) 开源免费天气预报接口API以及全国所有地区代码!!(国家气象局提供) 真正的中国天气api接口xml,json(求加精) ...
- android — JNI注册方法说明
Jni中还可以采用RegisterNatives来注册jni的方法,注册以后的jni函数的命名可以不需要符合类似javah命令生成的函数的规则 RegisterNatives为JNIEnv的成员函数, ...
- vs2008安装opencv2.4.6
最近安装opencv2.4.6,发现犯了一个很愚蠢的错误,在此记录一下. opencv的头文件包含应该位于build文件夹内,而我误将opencv文件夹下的include包含了进去,造成无法找到头文件 ...
- (中等) CF 576D Flights for Regular Customers (#319 Div1 D题),矩阵快速幂。
In the country there are exactly n cities numbered with positive integers from 1 to n. In each city ...
- Linux系统的/proc目录
1. /proc目录 Linux 内核提供了一种通过 /proc 文件系统,在运行时访问内核内部数据结构.改变内核设置的机 制.proc文件系统是一个伪文件系统,它只存在内存当中,而不占用外存空间.它 ...
- ASP.NET AJAX 创建类
<%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...
- mysql优化———第二篇:数据库优化调整参数
摘要 参数调优内容: 1. 内存利用方面 2. 日志控制方面 3.文件IO分配,空间占用方面 4. 其它相关参数 一 摘要 通过参数提高MYSQL的性能.核心思想如下: 1 提高my ...
- HDU 4008 Parent and son
树形DP+LCA+思路.这题可真是有点难度......所以准备详细写一下题解. 题意:给一颗无根树,有Q次询问,每次询问指定一个根节点X,然后让你计算Y节点的儿子和子孙中,编号最小的节点是多少. 我们 ...