JS清空(重置)条件

编辑
文档创建者:印然 (67260 )     浏览次数:8218次     编辑次数:15次     最近更新:jiangsr 于 2018-11-14     

目录:

1. 描述编辑

在使用控件时,有时我们希望能够快捷的重置控件的内容,或者重置所有控件的内容,效果如下图所示:
重置某个控件的内容:

222

重置所有控件的内容:

222

2. 思路编辑

只重置一个控件的值时,我们可以在js事件中获取需要重置的控件,setValue()setText()reset()给控件赋空值,从而清空该控件的内容 ,移动端使用reset()重置控件。
当我们需要重置全部控件时,可以通过form.name_widgets获取参数界面上所有的控件,然后遍历每个控件并重置,代码如下:
$.each(this.options.form.name_widgets, function(i, item) { if(item.options.type !== 'label') { item.setValue(); item.setText(); item.reset(); } });

3. 操作步骤编辑

以上效果图中的两个清空按钮来说明如何实现重置控件内容。
打开模板%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\parameter\ComplexParaInter.cpt
3.1 示例一:重置单个控件内容的按钮
以上图中清空供应商按钮为例,说明如何重置单个控件内容。
在参数设计页面新建一个按钮控件,设定其按钮名称为清空供应商,并添加点击事件,将供应商(supplierID)控件内容清空:
222
具体的js如下:
//获取supplierID控件 var supplierID = this.options.form.getWidgetByName("supplierID"); //将supplierID控件内容清空 supplierID.setValue(); supplierID.setText(); supplierID.reset();
移动端使用下面的js:
var supplierID = this.options.form.getWidgetByName("supplierID"); //获取supplierID控件 supplierID.reset(); //重置supplierID控件
注:PC端支持移动端的js代码,建议重置控件使用移动端的js,可以兼容PC端和移动端。
3.2 示例二:重置所有控件内容
在参数界面新建一个按钮控件,设定其控件名称为清空全部,并添加点击事件
222
事件js脚本为:
$.each(this.options.form.name_widgets, function(i, item) { if(item.options.type !== 'label') { item.setValue(); item.setText(); item.reset(); } });

移动端使用下面的js:

this.options.form.getWidgetByName("categoryID").reset(); //重置产品类别 this.options.form.getWidgetByName("supplierID").reset(); //重置供应商 this.options.form.getWidgetByName("pay").reset(); //重置订单支付状态 this.options.form.getWidgetByName("start").reset(); //重置起始日期 this.options.form.getWidgetByName("end").reset(); //重置结束日期

注:PC端支持移动端的js代码,建议重置控件使用移动端的js,可以兼容PC端和移动端。

4. 预览效果编辑

4.1 PC端预览效果

1)示例一:重置单个控件内容的按钮

222

2)示例二:重置所有控件内容

222

4.2 移动端预览效果 

1)示例一:重置单个控件内容的按钮

APP预览效果:

222

H5预览效果:

222

2)示例二:重置所有控件内容

APP预览效果:

222

H5预览效果:
222

5. 已完成模板编辑

1)示例一

模板效果在线查看请点击:JS清空(重置)条件-示例一.cpt
已完成的模板,可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\参数界面JS实例\17-JS清空(重置)条件-示例一.cpt

2)示例二

模板效果在线查看请点击:JS清空(重置)条件-示例二.cpt
已完成的模板,可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\参数界面JS实例\17-JS清空(重置)条件-示例二.cpt

附件列表


主题: 二次开发
如果您认为本文档还有待完善,请编辑

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

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