下面简单分析下这个测试类文件。首先在其构造函数中，加载了编写的datagrid数据表格helper文件和CI中的url helper类，并且通过
$this->Datagrid = new Datagrid('users','id');
初始化了数据助手类的构造方法，指定了表名是users,数据列为id。接着，通过
$this->Datagrid->setHeadings(array('email'=>'E-mail'));
设置了要显示的表头中，将email显示为E-MAIL。并通过
$this->Datagrid->ignoreFields(array('password'));
设置了，在数据表格列中不显示password一列。再接下来，则是调用generate()方法生成表格。而在proc()方法中，则负责处理用户对选择并删除记录的处理，而在if($request_type!='ajax'){ ……}的这段代码中，则判断是否属于ajax调用，如果不属于ajax调用，则正常返回出错提示信息，否则则使用json_encode方法返回错误信息，这个技巧也是很常用的，之所以这样做，其目的是为了能同时满足ajax及非ajax的调用。
最后运行的效果如下图：
▲
整合jQuery加入AJAX功能
现在，我们可以为其加入AJAX功能了，这就要整合jQuery。由于本文不是初学者的教程，因此不会讲解jQuery方面的知识，而是直接讲解如何整合。首先新建一个文件夹，命名为js，然后里面放置jQuery的库文件，并且新建立user.php文件，代码如下：
<html>
<head>
<title>Users Management</title>
<script src="<?php echo base_url(); ?>js/jquery-1.6.3.min.js"></script>
<script src="<?php echo base_url(); ?>js/datagrid.js"></script>
</head>
<body>
<?php
$this->Datagrid->hidePkCol(true);
if($error = $this->session->flashdata('form_error')){
echo "<font color=red>$error</font>";
}
echo form_open('test/proc',array('class'=>'dg_form'));
echo $this->Datagrid->generate();
echo Datagrid::createButton('delete','Delete');
echo form_close();
?>
</body>
</html>
<head>
<title>Users Management</title>
<script src="<?php echo base_url(); ?>js/jquery-1.6.3.min.js"></script>
<script src="<?php echo base_url(); ?>js/datagrid.js"></script>
</head>
<body>
<?php
$this->Datagrid->hidePkCol(true);
if($error = $this->session->flashdata('form_error')){
echo "<font color=red>$error</font>";
}
echo form_open('test/proc',array('class'=>'dg_form'));
echo $this->Datagrid->generate();
echo Datagrid::createButton('delete','Delete');
echo form_close();
?>
</body>
</html>
由于我们这里是采用ajax的方式去判断用户选择表中的哪些记录并且响应删除按钮的事件，所以只保留上面的php代码，而同时，在js目录下新建立一个js/datagrid.js文件，还要修改上文中的index 方法如下：
function index(){
$this->load->helper('form');
$this->load->library('session');
$this->load->view('users');
}
$this->load->helper('form');
$this->load->library('session');
$this->load->view('users');
}
也可以修改相关的CSS样式，例如：
.dg_form table{
border:1px solid silver;
}
.dg_form th{
background-color:gray;
font-family:"Courier New", Courier, mono;
font-size:12px;
}
.dg_form td{
background-color:gainsboro;
font-size:12px;
}
.dg_form input[type=submit]{
margin-top:2px;
}
border:1px solid silver;
}
.dg_form th{
background-color:gray;
font-family:"Courier New", Courier, mono;
font-size:12px;
}
.dg_form td{
background-color:gainsboro;
font-size:12px;
}
.dg_form input[type=submit]{
margin-top:2px;
}
