JS设置控件焦点

编辑
文档创建者:cherishdqy (66470 )     浏览次数:3741次     编辑次数:9次     最近更新:幽冥猫儿 于 2018-05-04     

目录:

1. 描述编辑

在做填报报表时,在某些特定情况下需要设置某个控件为焦点并可编辑,如下图的示例,文本框默认为不可用状态,如何实现点击编辑按钮使文本框变为可用并设置为焦点可编辑状态?
222

2. 思路编辑

给按钮增加点击事件使得文本控件可用

3. 操作步骤编辑

3.1 模板属性设置

点击模板>模板Web属性>填报页面设置,选择为该模板单独设置,勾选直接显示控件:


222

3.2 报表样式

如下所示添加文本控件和按钮控件:

222

文本控件,设置控件名为test,默认不可用:
222

按钮控件,设置按钮名称为编辑,点击事件编辑,添加“点击”事件,如下所示:
222

3.3 js代码设置

方法一:

编辑点击事件,添加下面的JavaScript代码:

var self =contentPane.getWidgetByName("test"); self.setEnable(true); var myFocusID = setInterval( function() { self.editComp.focus(); }, 20);

js代码说明:

var self =contentPane.getWidgetByName("test");   //获取文本控件,test为文本控件的控件名

self.setEnable(true);   //设置文本控件为可用

self.editComp.focus();   //将文本控件设置为焦点

注:方法一必须勾选直接显示控件,否则只能实现可编辑而不会自动成为焦点

方法二:
或者使用下面的JavaScript代码:
var self =contentPane.getWidgetByName("test"); self.setEnable(true); var cell = contentPane.curLGP.getTDCell(1,1); setTimeout( function() { contentPane.curLGP.selectTDCell(cell); setTimeout( function(){ contentPane.curLGP.editTDCell(cell); },20); },20)

js代码说明:

var cell = contentPane.curLGP.getTDCell(1,1); //获取焦点所在的单元格对象,getTDCell(1,1)即B2单元格

contentPane.curLGP.selectTDCell(cell);   //选择单元格

contentPane.curLGP.editTDCell(cell);/   //编辑单元格,即聚焦单元格

保存模板,点击填报预览即可查看效果,点击编辑按钮使文本框变为可用并设置为焦点可编辑状态,如上图。

4. 预览效果编辑

4.1 PC端预览效果

222

4.2 移动端预览效果

注:此JS不支持移动端使用

附件列表


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

文档内容仅供参考,如果你需要获取更多帮助,请咨询帆软技术支持
关于技术问题,您还可以通过帆软论坛获取帮助,论坛上有非常多的大神,有些水平比帆软工程师还要高哦。
若您还有其他非技术类问题,可以联系帆软传说哥(qq:1745114201

此页面有帮助吗?