jquery Easyui快速开发总结
最近工作很轻松,整理了些关于easyui的datagrid的开发文档,整理的比较细致,直接复制粘贴就可以使用了。
代码内容如下:
<linkhref="../../Content/easyUI/themes/default/easyui.css"rel="stylesheet"type="text/css"/>
<linkhref="../../Content/easyUI/themes/icon.css"rel="stylesheet"type="text/css"/>
<scriptsrc="../../Scripts/jquery-...min.js"type="text/javascript"></script>
<scriptsrc="../../Scripts/jquery.easyui.min.js"type="text/javascript"></script>
<scriptsrc="../../Scripts/easyui-lang-zh_CN.js"type="text/javascript"></script>
<scriptsrc="../../Scripts/datapattern.js"type="text/javascript"></script>
:<scripttype="text/javascript">
$(function(){
loadData();
});
functionloadData(){
$('#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,"newDate($)"))).pattern("yyyy-M-d");
}
}
]],
toolbar:[{
id:'btnGet',
text:'删除',
iconCls:'icon-add',
handler:function(){
varrows=$('#tt').datagrid('getSelections');
if(!rows||rows.length==){
//alert("请选择要修改的商品!");
$.messager.alert("提醒","请选择要删除的记录!","error");
return;
}
}
}],
});
}
</script>
<div>
<tableid="tt"style="width:px;"title="标题,可以使用代码进行初始化,也可以使用这种属性的方式"iconcls="icon-edit">
</table>
</div>
//将序列化成json格式后日期(毫秒数)转成日期格式
functionChangeDateFormat(cellval){
vardate=newDate(parseInt(cellval.replace("/Date(","").replace(")/",""),));
varmonth=date.getMonth()+<?""+(date.getMonth()+):date.getMonth()+;
varcurrentDate=date.getDate()<?""+date.getDate():date.getDate();
returndate.getFullYear()+"-"+month+"-"+currentDate;
}
以上代码示例给大家分享了jqueryEasyui快速开发,希望大家喜欢。