jquery Easyui快速开发总结

最近工作很轻松，整理了些关于easyui的datagrid的开发文档，整理的比较细致，直接复制粘贴就可以使用了。

代码内容如下：

<link href="../../Content/easyUI/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link href="../../Content/easyUI/themes/icon.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-...min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.easyui.min.js" type="text/javascript"></script>
<script src="../../Scripts/easyui-lang-zh_CN.js" type="text/javascript"></script>
<script src="../../Scripts/datapattern.js" type="text/javascript"></script>
：<script type="text/javascript">
$(function(){
loadData();
});
function loadData() {
$('#tt').datagrid({
url: '/Home/GetUserInfo',
title: '用户数据表格',
width: ,
height: ,
fitColumns: true, //列自适应
nowrap: false,
idField: 'ID',//主键列的列明
loadMsg: '正在加载用户的信息...',
pagination: true,//是否有分页
singleSelect: false,//是否单行选择
pageSize:,//页大小，一页多少条数据
pageNumber: ,//当前页，默认的
pageList: [, , ],
queryParams: {},//往后台传递参数
columns: [[//c.UserName, c.UserPass, c.Email, c.RegTime
{ field: 'ck', checkbox: true, align: 'left', width: },
{ field: 'ID', title: '编号', width: },
{ field: 'UserName', title: '姓名', width: },
{ field: 'UserPass', title: '密码', width: },
{ field: 'Email', title: '邮箱', width: },
{ field: 'RegTime', title: '时间', width: , align: 'right',
formatter: function (value, row, index) {
return (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($)"))).pattern("yyyy-M-d");
}
}
]],
toolbar: [{
id: 'btnGet',
text: '删除',
iconCls: 'icon-add',
handler: function () {
var rows = $('#tt').datagrid('getSelections');
if (!rows || rows.length == ) {
//alert("请选择要修改的商品！");
$.messager.alert("提醒", "请选择要删除的记录!", "error");
return;
}
}
}],
});
}
</script>
<div>
<table id="tt" style="width: px;" title="标题，可以使用代码进行初始化，也可以使用这种属性的方式" iconcls="icon-edit">
</table>
</div>
//将序列化成json格式后日期(毫秒数)转成日期格式
function ChangeDateFormat(cellval) {
var date = new Date(parseInt(cellval.replace("/Date(", "").replace(")/", ""), ));
var month = date.getMonth() + < ? "" + (date.getMonth() + ) : date.getMonth() + ;
var currentDate = date.getDate() < ? "" + date.getDate() : date.getDate();
return date.getFullYear() + "-" + month + "-" + currentDate;
}

以上代码示例给大家分享了jquery Easyui快速开发，希望大家喜欢。

您可能感兴趣的文章:

• jQuery EasyUI 的EasyLoader功能介绍
• JQuery EasyUI 对话框的使用方法
• jquery EasyUI的formatter格式化函数代码
• Jquery插件 easyUI属性汇总
• jQuery EasyUI API 中文文档 - Dialog对话框
• Jquery EasyUI中弹出确认对话框以及加载效果示例代码
• jquery easyui中treegrid用法的简单实例
• JQuery EasyUI 加载两次url的原因分析及解决方案
• jQuery前端框架easyui使用Dialog时bug处理
• jQuery EasyUI datagrid实现本地分页的方法
• jQuery+easyui中的combobox实现下拉框特效
• jquery中EasyUI实现同步树
• jQuery EasyUI实现右键菜单变灰不可用效果
• jQuery EasyUI Dialog拖不下来如何解决