历史版本12 :JS实现当前页刷新 返回文档
编辑时间:
内容长度:图片数:目录数:
修改原因:
1.概述编辑
场景1:实现填报成功后刷新当前页
场景2:报表里实现延时刷新
场景3:点击按钮刷新当前页面
1.1 预期效果
1.1.1 场景1
1.1.2 场景2
1.1.3 场景3
1.2 实现思路
可以通过location.reload() JS 来刷新当前页,和手动刷新是一样的;
如果报表有多页,刷新后返回第一页;
如果报表有参数界面,刷新后直接显示上次的参数条件查询后的结果;
手机端也可以进行刷新;
在所有可以使用 JS 的地方都可以触发该 JS。
2.示例一 填报刷新编辑
2.1 数据准备
新建数据集ds1,sql语句为:SELECT * FROM 雇员;
2.2 表格设计
表格设计如下:
2.3 添加JS事件
点击模板>模板 Web 属性>填报页面设置,选择为该模板单独设置,添加填报成功事件,如下图:
JS代码如下:
location.reload();
2.4 效果预览
2.4.1 PC端
2.4.2 移动端
3.示例二 提交校验刷新编辑
3.1 数据准备
新建数据集ds1,sql语句为:SELECT * FROM S产品 ORDER BY 产品ID LIMIT 5 ;
3.2 表格设计
表格设计如下:
注:A2至I2所有单元格中均插入文本控件。
3.3 添加JS事件
方法同 2.1.3 ,不同的是这里选择的事件类型为“校验后刷新”,如下图:
3.4 效果预览
3.4.1 PC端
3.4.2 移动端
4.示例三 点击按钮刷新编辑
4.1 数据准备
新建数据集ds1
SQL语句如下:
select CLASSNO as 班级, STUDENTNO as 学号,COURSE,NAME,GRADE from Stscore
where 1=1 ${if(len(班级)==0,"","and CLASSNO = '"+班级+"'")}
and 1=1 ${if(len(学号)==0,"","and STUDENTNO in ("+学号+")")
4.2 表格设计
1)表格设计如下:
2)合并A1至A4单元格,将各字段一次拖入表格中,A6单元格的上父格自定义为A1,如下图所示:
3)控件栏设计如下:
4.3 添加JS事件
1)在控件栏中新增一个按钮控件,将控件名称改为刷新,并添加点击事件,如下图所示:
2)当前控件栏如下图所示: