JQueryEasyUI datagrid框架的进阶使用


Posted in Javascript onApril 08, 2013

由于datagrid接收数据为Json格式,所以我们在前台展示数据的时候会出现问题,尤其是时间格式,在Json序列化之后,前台无法展示正确的时间数据,那么我们如何解决这样的问题呢?首先我们可以使用datapattern.js来解决这个问题:无需废话,直接上代码:

<script src="Scripts/datapattern.js" type="text/javascript"></script>
//列表初始化
function initTable(searchWhere) {
$('#tt').datagrid({
url: '/UserInfo/GetAllUserInfos',
title: '用户列表',
width: 700,
height: 400,
fitColumns: true,
idField: 'ID',
loadMsg: '正在加载用户的信息...',
pagination: true,
singleSelect: false,
pageSize: 10,
pageNumber: 1,
pageList: [10, 20, 30],
queryParams: searchWhere,
columns: [[
{ field: 'ck', checkbox: true, align: 'left', width: 50 },
{ field: 'ID', title: '用户编号', width: 80 },
{ field: 'UName', title: '用户名', width: 120 },
{ field: 'Pwd', title: '密码', width: 120 },
{ field: 'Phone', title: '手机', width: 120 },
{ field: 'Mail', title: '邮箱', width: 120 },
{ field: 'SubTime', title: '注册时间', width: 120,
formatter: function (value, row, index) {//Json格式时间转化为正常格式
return (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-MM-dd");
}
}
]],
toolbar: [
{
id: 'btnadd',
text: '注册用户',
iconCls: 'icon-add',
handler: function () {
showCreateDialog();
}
},
{
id: 'btnDownShelf',
text: '修改用户',
iconCls: 'icon-edit',
handler: function () {
upDateUser();
}
},
{
id: 'btnDel',
text: '删除用户',
iconCls: 'icon-cancel',
handler: function () {
delUsers();
}
},
{
id: 'btnSet',
text: '设置用户角色',
iconCls: 'icon-redo',
handler: function () {
setUserRole();
}
},
{
id: 'btnSetVip',
text: '设置特殊角色',
iconCls: 'icon-redo',
handler: function () {
setVip();
}
}]
});
}

toolbar指的是表单上面的按钮,api中好像没有介绍,但是可以直接以数组的形式写到上面,完美显示:

JQueryEasyUI datagrid框架的进阶使用

图片跟上面的代码不是对应的,只是为了展示个效果;easyuidatagrid+asp.net mvc3的示例代码下载地址(只有前台和Controller):增删改都写了 
示例下载地址:http://download.csdn.net/detail/a417758082/5215044
datapattern.js下载地址:
http://download.csdn.net/detail/a417758082/5215139
Javascript 相关文章推荐
基于jquery的Repeater实现代码
Jul 17 Javascript
JQuery datepicker 使用方法
May 20 Javascript
showModelDialog弹出文件下载窗口的使用示例
Nov 19 Javascript
jQuery处理xml格式的返回数据(实例解析)
Nov 28 Javascript
jquery 3D 标签云示例代码
Jun 12 Javascript
JavaScript 学习笔记之变量及其作用域
Jan 14 Javascript
JavaScript常见的五种数组去重的方式
Dec 15 Javascript
Jquery Easyui菜单组件Menu使用详解(15)
Dec 18 Javascript
bootstrap选项卡使用方法解析
Jan 11 Javascript
微信小程序开发之转发分享功能
Oct 22 Javascript
微信小程序监听用户登录事件的实现方法
Nov 11 Javascript
vue使用echarts画组织结构图
Feb 06 Vue.js
基于datagrid框架的查询
Apr 08 #Javascript
datagrid框架的删除添加与修改
Apr 08 #Javascript
jQuery中setTimeout的几种使用方法小结
Apr 07 #Javascript
jQuery setTimeout()函数使用方法
Apr 07 #Javascript
jquery全选/全不选/反选另一种实现方法(配合原生js)
Apr 07 #Javascript
关于jQuery参考实例 1.0 jQuery的哲学
Apr 07 #Javascript
jQuery操作checkbox选择(list/table)
Apr 07 #Javascript
You might like
PHP时间格式控制符对照表分享
2013/07/23 PHP
php实现将字符串按照指定距离进行分割的方法
2015/03/14 PHP
TNC vs IO BO3 第二场2.13
2021/03/10 DOTA
JS模拟自动点击的简单实例
2013/08/08 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
2014/04/06 Javascript
一个仿糯米弹框效果demo
2014/07/22 Javascript
微信小程序 HTTPS报错整理常见问题及解决方案
2016/12/14 Javascript
提高Web性能的前端优化技巧总结
2017/02/27 Javascript
Angular实现下载安装包的功能代码分享
2017/09/05 Javascript
使用elementUI实现将图片上传到本地的示例
2018/09/04 Javascript
Vue中用props给data赋初始值遇到的问题解决
2018/11/27 Javascript
通过JS运行机制的角度说说作用域
2019/03/12 Javascript
实现高性能javascript的注意事项
2019/05/27 Javascript
Vue快速实现通用表单验证功能
2019/12/05 Javascript
解决vue刷新页面以后丢失store的数据问题
2020/08/11 Javascript
[35:27]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第二场 10.29
2020/10/29 DOTA
完美解决Python2操作中文名文件乱码的问题
2017/01/04 Python
[原创]windows下Anaconda的安装与配置正解(Anaconda入门教程)
2018/04/05 Python
pandas实现to_sql将DataFrame保存到数据库中
2019/07/03 Python
详解python中的index函数用法
2019/08/06 Python
40个你可能不知道的Python技巧附代码
2020/01/29 Python
Python使用enumerate获取迭代元素下标
2020/02/03 Python
pandas实现excel中的数据透视表和Vlookup函数功能代码
2020/02/14 Python
python UIAutomator2使用超详细教程
2021/02/19 Python
美国领先的水果篮送货公司和新鲜水果供应商:The Fruit Company
2018/02/13 全球购物
德国亚洲食品网上商店:asiafoodland.de
2019/12/28 全球购物
Weblogic和WebSphere不同特点
2012/05/09 面试题
学习实践科学发展观心得体会
2014/09/10 职场文书
大学生团员个人总结
2015/02/14 职场文书
525心理健康活动总结
2015/05/08 职场文书
企业员工辞职信范文
2015/05/12 职场文书
教师培训简讯
2015/07/20 职场文书
庆祝教师节主题班会
2015/08/17 职场文书
2016年学校爱国卫生月活动总结
2016/04/06 职场文书
深度好文:50条没人告诉你的人生经验,句句精辟
2019/08/22 职场文书
Python各协议下socket黏包问题原理
2022/04/12 Python