JS实现点击查询后停留在当前查询的tab页

编辑
  • 文档创建者:yiyemeiying
  • 浏览次数:5682次
  • 编辑次数:12次
  • 最近更新:Kevin-s 于 2019-06-23
  • 1. 描述

    在使用表单的 Tab 块功能时,我们经常会遇到类似这样的问题:当在一个 Tab 块中有多个 Tab 页存在,如果用户所处其他 Tab 页(非第一个 Tab 页),点击查询后,会自动跳转到第一个 Tab 页(如图一)。如何能实现:点击查询后,不自动跳转到第一个 Tab 页,还是在用户当前 Tab 页呢(如图二)?

    图一:


    图二:



    2. 思路

    通过在 Tab 块中设置 JavaSprite 脚本来实现此功能。先通过切换事件获取到用户当前 Tab 页的标题索引,然后在点击查询后,直接初始化定位到获取到的 Tab 标题索引页。

    1)Tab 切换事件:

    setTimeout(function(){
    //TAB切换后,获取到当前TAB块的标题索引
    window.IndexNum=_g().getWidgetByName("tabpane0").getShowIndex();
    },50);

    2)Tab 初始化事件:

    this.options.form.getWidgetByName("tabpane0").showCardByIndex(window.IndexNum);


    3. 操作步骤

    1)打开%FR_HOME%\webapps\webroot\WEB-INF\reportlets\demo\Oldchart\advanced\tab标签.frm文件,新增一个参数界面,添加查询控件


    2)选中 Tab 块控件,在控件列表中选择所选 Tab 块下方的 tabpane0,新增一个 Tab 切换事件


    JS 脚本如下:

    setTimeout(function(){
    //TAB切换后,获取到当前TAB块的标题索引
    window.IndexNum=_g().getWidgetByName("tabpane0").getShowIndex();
    },50);

    3)选中 Tab 块控件,在控件列表中选择所选 Tab 块下方的 tabpane0,新增一个初始化后事件


    JS 脚本如下:

    this.options.form.getWidgetByName("tabpane0").showCardByIndex(window.IndexNum);

    4)保存,点击表单预览,效果如上图二所示。


    4. 预览效果

    4.1 PC 端预览效果



    4.2 移动端预览效果

    注:不支持移动端。


    5. 已完成模板

    模板效果在线查看请点击:JS 实现点击查询后停留在当前查询的tab页.frm

    已完成的模板,可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\填报预览JS实例\06-JS实现点击查询后停留在当前查询的tab页.frm

    右击存储模板


    附件列表


    主题: 二次开发
    标签: 暂无标签 编辑/添加标签
    如果您认为本文档还有待完善,请编辑

    文档内容仅供参考,如果你需要获取更多帮助,付费/准付费客户请咨询帆软技术支持
    关于技术问题,您还可以前往帆软社区,点击顶部搜索框旁边的提问按钮
    若您还有其他非技术类问题,可以联系帆软传说哥(qq:1745114201

    此页面有帮助吗?只是浏览 [ 去社区提问 ]