多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
# 列表的控制 快速实现 对列表的刷新,批量删除,批量编辑等操作 任何一个控件,如果相对某一个列表进行控制,只需在class加上`btn-table-tool` 即可。如 ```html <a class="btn btn-danger btn-table-tool" data-do="do1" data-table-id="table1">操作1</a> ``` 在 class加上btn-table-tool后支持的属性有 属性|意义 ---|--- `data-table-id`|要控制的tableid,若为空,则为页面的第一个table标签。 `data-do`| 要进行什么操作。`data-do='fun'` 只为函数名 >[info] data-do的函数为,function(ids,select_data), ids:为选择的id数组,select_data 为选择行对应的后台返回的数据 ```javascript function do1(ids,select_data) { console.log("select ids is:"); console.log(ids); console.log("select_data is:"); console.log(select_data) } ``` 选择后 ![table12] 点击`操作1`按钮,控制台输出 ![table11] 操作视频 <p> <video controls="controls" width="100%" src="http://epii.gitee.io/static/project/epiiadmin-js/docimg/table10.mov"></video> </p> ## `EpiiAdmin` 预设了两个常用的操作函数为: 属性|意义 ---|--- `refresh`| 对列表刷新 `url`| 通过传递{ids}对选择的行进行处理,如批量详情,批量删除,批量编辑等操作 1、刷新`refresh` ```html <a class="btn btn-info btn-outline-info btn-table-tool" data-do="refresh"> <i class="fa fa-refresh"></i>刷新</a> ``` >[warning] 没有设置data-table-id,默认为页面第一个table <p> <video controls="controls" width="100%" src="http://epii.gitee.io/static/project/epiiadmin-js/docimg/table13.mov"></video> </p> 2、访问`url` 当`data-do='url'` 时候,有效的属性为: 1、`data-url='http://domain.com/test.php?selectid={ids}'` 其中`{ids}`为选择的ids。数据的`id字段`默认的key为`id` 可通过table的`data-id-field`属性修改。 >[danger] 如果按钮为A标签,也可以用 href 属性 2、其它设置 设置|意义 ---|--- `data-addtab=1`|在头部tab导航栏打开页面,更多参数请参考 [`addtab章节`](addtab.md) `data-dialog=1`|以dialog的方式打开页面,更多参数请参考 [`dialog章节`](dialog.md) `data-ajax=1`| 已ajax方式请求连接,更多参数请参考 [`ajax章节`](ajax.md) 例1, ```html <a class="btn btn-info btn-outline-info btn-table-tool" data-do="url" data-dialog="1" data-area="80%,90%" data-title="详情" href="{:url("demo/index/details")}?ids={ids}">详情</a> ``` 操作视频 <p> <video controls="controls" width="100%" src="http://epii.gitee.io/static/project/epiiadmin-js/docimg/table14.mov"></video> </p> 例2, ```html <a class="btn btn-danger btn-outline-info btn-table-tool" data-do="url" data-alert="1" data-ajax="1" data-title="提示" data-msg="确定要删除吗?" data-intop="1" href="{:url("demo/index/ajax_del")}?ids={ids}">删除</a> ``` 操作视频 <p> <video controls="controls" width="100%" src="http://epii.gitee.io/static/project/epiiadmin-js/docimg/table16.mov"></video> </p> >[danger] 支持所有之前 *alert,confirm,addtab,dialog章节* 的参数 [table11]:http://epii.gitee.io/static/project/epiiadmin-js/docimg/table11.png [table12]:http://epii.gitee.io/static/project/epiiadmin-js/docimg/table12.png