可复用的页面顶栏功能集中区解决方案（母版页与子页面数据交换方案）

# 1. 问题场景
我想用活字格替换公司原先的ERP系统，希望在界面结构上与原先保持相似，减少学习成本，故希望在数据显示页的顶部集中一个功能区，如下图所示：

如果单纯在页面的顶部添加按钮，当表格中的单元列宽配置为范围模式以适应屏幕拉伸时，会出现按钮变形或间距变化：


于是我使用了母版页的功能，将所有的按钮放在母版页上，解决了按钮的变形，以及实现了该功能区的复用。

但是母版页的按钮如何控制子页面上的表格呢？

# 2. 解决方案
首先，我在子页面的隐藏列添加了控制表格的功能按钮：

之后，为这三个功能按钮添加类名：



在母版页的按钮命令中通过jquery获取子页面指定单元格（利用类名），控制功能按钮：


注意：由于单元结构在HTML中有多层，可对照页面中的元素编写代码。


# 3. 扩展
通过读取子页面指定单元格的内容，我们可以对母版页的功能区按钮进行修改，隐藏，以适应不同的表格。

其实也可以用横向菜单方案，一个控件整体布局，一样棒棒的，而且不绕弯弯。

amtath 发表于 2022-2-26 22:14
其实也可以用横向菜单方案，一个控件整体布局，一样棒棒的，而且不绕弯弯。

ok 学习 感谢指教

amtath 发表于 2022-2-26 22:14
其实也可以用横向菜单方案，一个控件整体布局，一样棒棒的，而且不绕弯弯。

好思路