上篇博客我只是将界面的部分完成了,继续上篇博客的内容,这篇博客我们需要将数据库中的记录显示到界面上,并实现数据的分页显示。
曾经我写过分页的博客,分页很简单, 本质区别在于分页时从数据库读取信息的方式:假分页:一次性读取数据;真分页:多次读取数据。datagrid使用的是真分页,将记录从数据库查询出来就行了。
下面我们看一下要实现的界面:
说实话,加载数据并实现分页和搜索的功能相对而言是很简单,无非就是调用一般处理程序,只要你会一般处理程序就没有任何问题。
在上篇博客中,我已将datagrid要调用的一般处理程序的URL写好了,所以我们现在只需要写一般处理程序的代码和后台的代码就好了。在一般处理程序中,我们将分页和查询功能巧妙的整合到了一起。
- //获取参数
- function getQueryParams(queryParams) {
- var StartTime = $("#StartTime").datebox("getValue");
- var EndTime = $("#EndTime").datebox("getValue");
- var AdminName = document.getElementById("AdminName").value;
- var QuanXian = document.getElementById("quanxian").value;
- //$("#quanxian").combobox("getValue");
- queryParams.StartTime = StartTime;
- queryParams.EndTime = EndTime;
- queryParams.AdminName = AdminName;
- queryParams.QuanXian = QuanXian;
- return queryParams;
- }
- //增加查询参数,重新加载表格
- function reloadgrid() {
- //查询参数直接添加在queryParams中
- var queryParams = $('#tt').datagrid('options').queryParams;
- getQueryParams(queryParams);
- $('#tt').datagrid('options').queryParams = queryParams;
- $("#tt").datagrid('reload');
- }
一般处理程序SetAdmin.ashx