复杂联动表格使用 点击主表格,加载副表格数据,支持主、副表格的 增删改查 操作。
演示地址:http://fslayui.itcto.cn
复杂联动表格配置
和基础联通表格类似,在基础上扩展一些增删改查功能,基础联动表格参考:http://www.itcto.cn/layui/linkageDatagrid/
复杂的联动表格需要在基础表格上增加 defaultForm
配置和按钮操作。
联动表格demo
主表格demo
主表格需要在基础表格上新增默认form表单id配置 defaultForm
- form查询条件配置
1 | <form class="layui-form" id="query_form"> |
- 菜单配置
1 | <button class="layui-btn" function="top" topUrl="../complexDatagrid/add.html" topWidth="700px" topHeight="450px" topTitle="新增功能号信息"> |
- 表格配置
1 | <table id="fsDatagrid" lay-filter="fsDatagrid" class="fsDatagrid" clickRenderTable="fsDatagrid2" clickRenderTableInputs="funcId:$id" isLoad="1" defaultForm="query_form" url="/fsbus/S1023" isPage="1" height="260"></table> |
副表格demo
副表格需要特别注意button按钮中的
tableId
配置,通过配置按钮的tableId
控制需要刷新的table。
- form查询条件配置
1 | <form class="layui-form" id="query_form2"> |
- 菜单配置
1 | <div id="table_buttion_div"> |
- 表格配置
1 | <table id="fsDatagrid2" class="fsDatagrid" lay-filter="fsDatagrid2" url="/fsbus/S1030" isLoad="0" defaultForm="query_form2" height="260" isPage="0"></table> |