学校在大三的时候开了实训课程,八人组队去完成一个为期六周的进销存管理系统。在这六周里,我从一个只会写粗糙静态页面的前端菜鸟,变成了有那么一丢丢经验的前端菜鸟。我仍然很菜,但是我打算把这段时期学习到的前端知识总结一下,就当是纪念这段实训生活吧!
进销存管理系统主要以表格为主,进行一些新增、统计、删除的操作,其中表格大致分为两类:可编辑的和点击按钮后可编辑的。但是普通的表格类似于<table></table>的定义并不能满足我们的需求。因此在前期的挣扎思考中,我们选择了bootstrap-table和jQuery-ui的 tabulator的表格插件,分别主要用来实现点击按钮后可实现和可编辑的表格。今天就先主要说一下Tabulator。
Tabulator是jquery-ui中很冷门的一个插件,除了官方文档,没有任何的可参考文献、博客等,因此探索之路困难重重。
首先是Tabulator的官方网址:http://tabulator.info/
一、Tabulator的初始化
首先引入Tabulator的包,可以下载之后在项目中引用,也可以直接用cdn的地址,但是要注意,记得引用jquery-ui的包:
<head>
<script type="text/javascript" src="../js/jquery-ui.min.js"></script>
<link href="../css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="../js/tabulator.min.js"></script>
<link rel="sty