DHTMLX grid 一个简单的实例

（一）JSP上使用DHTMLX Grid插件

加载必要的.css以及.js文件

 <link rel="stylesheet" href="css/dhtmlxgrid.css" type="text/css"></link>
<link rel="stylesheet" type="text/css" href="js/jquery.pagination/pagination.css" />

<script type="text/javascript" src="js/jquery-1.6.1.js"></script>

<script type="text/javascript" src="js/dhtmlxgrid.js"></script>

<script type="text/javascript"src="js/jquery.pagination/jquery.pagination.js"></script>   

第一步：JSP上定义两个个DIV(grid以及分页)

<div id="grid_storelimit"
style="width: 100%; background-color: white;"></div>
<div id="Pagination"
style="position: relative; top: 7px; left: 5px; float: right; display: block; margin-top: -30px"></div>
</div>

第二步：JS中inti 生成grid_storein 

var autoheight=($(window).height()-240);

$("#grid_storelimit").css("height", autoheight);
$("#bgrid").css("height", autoheight+12);
grid_storein = new dhtmlXGridObject('grid_storelimit');
grid_storein.setImagePath("dhtmlxGrid/codebase/imgs/");
grid_storein.setHeader("选择,疾病名称,发病日期,诊断日期,患者姓名,填卡医生,上报时间,接收时间,是否修改,操作");
grid_storein.setInitWidths("45,*,108,108,80,88,130,130,60,60");
grid_storein.setColAlign("center,center,center,center,center,center,center,center,center,center");
grid_storein.setColTypes("ch,ro,ro,ro,ro,ro,ro,ro,ro,ro");
grid_storein.setSkin("dhx_custom");

//grid_storein.attachEvent("onEditCell",doGridEditCell);
//grid_storein.clearAndLoad("drugmanage/load_medstore_warning.htm");
grid_storein.attachEvent("onRowDblClicked", onRowDblClicked);

//初始化隐藏相关列
grid_storein.setColumnHidden(7,true);
grid_storein.setColumnHidden(8,true);

grid_storein.setColumnHidden(9,true);

grid_storein.init();

第三步 grid分页以及加载行

//无查询条件返回分页页数
function loadCount_no(){
getSearchCondition();
$.ajax({
async: false,
cache: false,
ifModified: true,
type: "GET",
url: "TnbSickUpload/getCounttnb.htm?status=no&patname="+patname+"&diagname="+diagname+"&diagdate_begin="+diagdate_begin+"&diagdate_end="+diagdate_end+"&distype="+distype,
error:function(){
alert("服务器内部错误！");
},
success: function(data){
//alert(data);
createPagination_no(data);
}
});
}

function createPagination_no(pageCount){//创建分页标签，pageCount为返回的记录数
if(pageCount==0){
pageCount=0;
}
//分页，pageCount是总条目数，这是必选参数，其它参数都是可选
$("#Pagination").pagination(pageCount, {
callback: pageCallback_no,
prev_text: '上一页', //上一页按钮里text
next_text: '下一页', //下一页按钮里text
items_per_page: pageSize, //显示条数
num_display_entries: 6, //连续分页主体部分分页条目数
current_page: pageIndex, //当前页索引
num_edge_entries: 2 //两侧首尾分页条目数
});
}

function pageCallback_no(index, jq){//翻页回调
pageIndex = index; //当前页索引
loadgrid_no(index);
return false;
}

//条件查询获取当前页未处理报表
function loadgrid_no(index){
getSearchCondition();
if(index!=0){
index = pageIndex;
}
grid_storein.clearAndLoad("TnbSickUpload/loadtnb.htm?index="+index+"&size="+pageSize+"&status=no&patname="+patname+"&diagname="+diagna me+"&diagdate_begin="+diagdate_begin+"&diagdate_end="+diagdate_end+"&distype="+distype);
}

（二）后台Action中的处理(SpringMVC )

   //返回分页页数
@RequestMapping("/getCounttnb")
public void getCount(HttpServletRequest req,HttpServletResponse response,String status) throws IOException {
String sql="select count(*)  as count from (.......)";

List<Map> list = null;
DBOperator db = null;
int count = 0;
try {
db = new DBOperator();
list = db.find(sql);
db.commit();
count=Integer.valueOf(String.valueOf(list.get(0).get("count")));
} catch (Exception e) {
e.printStackTrace();
} finally
{
db.freeCon();
}
response.setContentType("text/html;charset=utf-8");
PrintWriter pw = response.getWriter();
pw.print(count);
pw.flush();
pw.close();
}

 //返回疾病结果
@RequestMapping("/loadtnb")
public void loadGrid(HttpServletRequest req,HttpServletResponse response,String status) throws IOException {
String pagingSql1 = "select OHYEAH.* from (select OHNO.*,rownum no from ("; // 用于分页// 段1
String pagingSql2 = ") OHNO where rownum <= ?) OHYEAH where no > ?"; // 用于分页段2
String sql = "........";
DBOperator db = null;
try {
db = new DBOperator();
List<Map<String,Object>> list = db.find(pagingSql1+sql+pagingSql2, new Object[] { pageIndex * pageItems + pageItems,pageIndex * pageItems }));
response.setContentType("text/xml;charset=utf-8");
String vmpagckage = "com/cpinfo/his/template/contagion/";
String vmname = "untreate_tnb2.vm";
PrintWriter pw = null;
pw = response.getWriter();
String vm = VelocityUtils.generateGridVm(vmpagckage, vmname,"showList", list);
pw.print(vm);
pw.flush();
pw.close();
} catch (Exception e) {
e.printStackTrace();
} finally
{
db.freeCon();
}
}