欢迎关注支持。

前言

在遇到表格插件之前，开发后台表格的时候，一直是手写table，th，tr，td，或者不停的复制粘贴，不胜其烦，自从用了mmGrid来创建表格或者列表，在也没有烦恼了，今天我们一起来看看mmGrid插件为什么让后台开发工程师上瘾的。

内容概要

1、mmGrid简介

2、mmGrid常用功能介绍

3、mmGrid实践

一、mmGrid简介

mmGrid基于jQuery的表格插件，样式简洁，修改容易，基本上可以满足日常后台开发的列表需要。可以支持本地数据源和远程数据源。下面来几个动态图大家看看。

mmgrid

mmgrid

二、mmGrid常用功能介绍

我这里简单列举一下：

1、支持列排序

2、可以支持拖动列宽

3、支持表头分组（二级表头）

4、支持行索引

5、支持多行选中，多行操作

6、自适应表格宽和高

三、mmGrid实践

我这里说PHP的实践思路：

1、首先将mmGrid封装到一个html文件中，并且使用AJAX的方式加载数据

2、在后台php文件中，对表格所需的表头，数据进行封装。

经过前端和后端的两个封装，表格的创建就非常容易了，我给出以前做的一个CI框架的例子和效果，大家参考。

先看效果：

案例

A）前端的封装。

表格文件放到一个mmGrid.html文件中，该文件分为三个部分，一个是引入样式文件代码，二是正文表格的代码，三是配置代码，四是引入js文件代码。我这里贴出关键的二和三，其他大家搜索一下可以得到。

上面的代码实现两个功能：一个是页面的标题和副标题，二是引入搜索文件。

这些配置文件大家参考官方的解释吧。主要是加载表格的配置。

引用的时候，写一个搜索文件就可以了，说的不明白，看后端代码就明白了。

B）后端代码，分为两个部分，一是配置表格的实际内容，二是引入搜索文件。

关键代码如下：

其中，index和query方法可以在父类方法中给出，如果没有特殊需要的话，控制器部分可以省略这两个方法。

listDataFormat是对model传过来的数据进行格式化，比如时间戳改成可读的形式。

另外，可以使用js对常用的查看，删除，编辑等行操作进行封装，比如我这里封装后，在控制器里写一个delete方法就可以满足删除的操作需求。

可能没有说的太清楚，如果需要源码的话，我把github上的代码整理一下再发出来给大家参考。