easyUI datagrid使用

1，---------------------------------------导入必要的文件----------------------------------------------------

<!-- 使用easyUi所需要的样式，和js文件 -->
<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="../themes/icon.css"/>
<link rel="stylesheet" type="text/css" href="../css/demo.css"/>
<link rel="stylesheet" type="text/css" href="../css/smartpaginator.css"/>

<script type="text/javascript" src="../js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/smartpaginator.js"></script>
2，在jsp页面添加下列html标签，注意这里设置的id.

<table id="xmjtList" width="500" high="700"></table>

3，使用jquery对上面的标签添加数据（这里就是datagrid的使用）

$(function() {
//这里是datagrid的重点。

$('#xmjtList').datagrid({
url:xmjtUrl,//获取数据的url（这里获取的数据要符合json数据格式）
loadMsg:"正在加载数据，请等待！",
singleSelect:true,//设置单选、多选。true单选，false 多选。
rownumbers:true,
singleSelect:true,
autoRowHeight:false,
pagination:true,
pageSize:10,
idField:'id',
columns:[[//datagrid展示的列:合同id,项目名称，项目类型，承担单位。
{field:'ck',checkbox:true,disable:true,title:'操作'},
{field:'unid',title:'合同id',hidden:true,sortable:true},
{field:'xmmc',title:'项目名称',width:150,sortable:true},
{field:'xmlx',title:'项目类型',width:200,sortable:true},
{field:'cddw',title:'承担单位',width:300,sortable:true}
]]
});

//设置分页控件，这里为datagrid添加客户端分页。前台数据获取的数据比较少的时候可以考虑使用。

//这是额外的，如果你不使用分页后面这段代码不用添加。
var p = $('#xmjtList').datagrid('getPager');
$(p).pagination({
pageSize: 10,//每页显示的记录条数，默认为10
pageList: [5,10,15],//可以设置每页记录条数的列表
beforePageText: '第',//页数文本框前显示的汉字
afterPageText: '页 共 {pages} 页',
displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录'

});

});

4，对于json不了解建议看下下面的网站。

http://www.json.org/

---------------------------------------

希望大家给点建议。