Jeesite框架实用 前端页面如何实现双表联动
文章目录
文章目录前言
有时我们需要两张相关联的表，显示在一个页面上，并且具备一些功能。如图：
由图可知，上下两张表是单独的，只有创会id是相同的
上表，可以翻页，并且选中后双击，便可以在下表的审查中，显示id相同的信息。
一、问题
如何制作这张双表联动？
二、使用步骤
1.模板
可以直接复制模板到HTML中，然后在进行修改即可。关键要修改的地方，已标注一二三。
代码如下（示例 由jeesite框架源码中demo提供）：
2.修改数据
上表和下表这两个表联动 ，其实jeesite是可以生成两张单独的表，单独的list和form页面的
1. 模板中 第二步和第四步 可以直接从 上表单独的lits 和下表单独的list 中 <#form:form > 找到这个标签里的内容 复制粘贴过来就行。
data-page-size="${parameter.pageSize!3} 其中这个 !3 表示一次显示三行信息。
2. 模板中 第五步
<#form:input name="employee.postCode" id="postCode" class="form-control"/>
这个那么name 要注意 ：如果是两张单表 只有id相关联 name 只需填id的名称就行比如 meetingId
这里employee.postCode 是因为 employee是上下表中间的一张关联表，上下表的id不同，employee只存储两张表的id。
3. 模板中第六 第七步
也可以从上下表中单独的list中复制粘贴过来。
总结
修改数据 中的 2 一定要注意，这里name的值填写极易出现错误。
