Epimenides 发表于 2022-2-26 22:02:05

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

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

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


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

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

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

之后,为这三个功能按钮添加类名:



在母版页的按钮命令中通过jquery获取子页面指定单元格(利用类名),控制功能按钮:


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


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

amtath 发表于 2022-2-26 22:14:01

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

Epimenides 发表于 2022-2-26 22:23:42

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

ok 学习 感谢指教

scliudong 发表于 2022-2-27 23:19:32

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

好思路
页: [1]
查看完整版本: 可复用的页面顶栏功能集中区解决方案(母版页与子页面数据交换方案)