开发工具与关键技术: Visual Studio 2015 – Layui表格渲染
作者:廖亚星
撰写时间:2019年5 月15 日
下面我用Layui插件来渲染代码,首先我们要引用JS
我们先在DIV中设置一个table,并设置好ID
下面我们需要在script中编写代码
先设置两个全局变量,方便在后面接收
下面图片中
参数elem类型是String/DOM,指定原始 table 容器的选择器或 DOM,是必填项,这里面我填的是table的ID
参数url中的值是控制器中定义方法的地址
参数cols类型是一个数组,设置表头,是必填项,其中title是表头的名字,type是传入数据的类型,field是传入数据的字段名,align是让每行内容居中,templet是自定义列模板,可以自己创建方法,后面填的是方法定义的名称
下面是自定义方法,直接在表格中创建两个按钮
还可以给表格一个分页查询默认是10条数据一页,也可以自定义设置多少条数据为一页,图中还有标记选中行和单击选中单选框的效果,这样当点击每行任意一处时,即可选中当前行
同时在控制器中查询表格数据,让表格数据按设定方式排序,并且进行分页
这样数据表格渲染就做好了