我在重复控件中有一个字段。现在我在viewScope
事件中使用onChange
来捕获重复控件中的字段值。每次字段必须部分刷新以获取范围变量中设置的值。
此处的问题是当用户将焦点设置在重复控件之外时,在完成部分刷新字段之前不会设置焦点。当用户访问远程多米诺骨牌服务器时,有时这种部分刷新太慢。提交表单时是否有一种有效的方法来捕获重复控件中的值?
我们的想法是在用户点击添加按钮时动态创建字段。将焦点从重复控件内的字段移动到重复控件外部的字段时,会发生此问题。在重复控制内部的部分刷新完成之前,不设置焦点。如果服务器在您的计算机上本地运行,则可能不会出现此情况。以下代码显示了重复控制用于动态创建字段的用法
<xp:button value="Add Objects" id="addNavObj">
<xp:eventHandler event="onclick" submit="true"
refreshId="objLine" refreshMode="partial" id="eventHandler24">
<xp:this.action><![CDATA[#{javascript:viewScope.rowItems=viewScope.rowItems+1;getComponent("navObjRep").setValue(parseInt(viewScope.rowItems));}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
<xp:repeat rows="30" var="rowData" indexVar="rowIndex"
repeatControls="false" first="0" value="#{javascript:viewScope.rowItems}"
id="navObjRep" style="width:800.0px">
<xp:panel style="width:800.0px" id="objLine">
<xp:table style="width:800.0px">
<xp:tr>
<xp:td style="width:245.0px">
<xp:inputText id="objType" style="width:130.0px">
<xp:typeAhead mode="full" minChars="1" ignoreCase="true"
id="typeAhead4" rendered="false">
</xp:typeAhead>
</xp:inputText>
</xp:td>
<xp:td style="width:46.0px">
<xp:inputText id="objCode">
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="objCode" id="eventHandler3">
<xp:this.action><![CDATA[#{javascript:viewScope['objCode'+rowIndex] = getComponent("objCode").getValue()}]]></xp:this.action>
</xp:eventHandler>
</xp:inputText>
</xp:td>
<xp:td style="width:300.0px">
<xp:inputTextarea id="objDesc" style="height:40.0px;width:200.0px">
<xp:eventHandler event="onclick" submit="false" id="eventHandler40"></xp:eventHandler>
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="objDesc" id="eventHandler4">
<xp:this.action><![CDATA[#{javascript:viewScope['objDesc'+rowIndex] = getComponent("objDesc").getValue()}]]></xp:this.action>
</xp:eventHandler>
</xp:inputTextarea>
</xp:td>
</xp:tr>
</xp:table>
</xp:panel>
</xp:repeat>
答案 0 :(得分:0)
它只是一个简单的示例,用于重复控制,具有可变数量的输入和计算Fields.Hope它可以帮助您解决问题。
<xp:this.beforePageLoad><![CDATA[#{javascript:var languages:java.util.Vector = @Explode("de,en,pl",",");
viewScope.put("allLanguages",languages);
viewScope.put("selectedLanguages", languages)}]]>
</xp:this.beforePageLoad>
<xp:checkBoxGroup id="checkBoxGroup1" value="#{viewScope.selectedLanguages}">
<xp:this.defaultValue><![CDATA[#{javascript:return viewScope.get( "allLanguages" );}]]></xp:this.defaultValue>
<xp:eventHandler event="onchange" submit="true" refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:// full update //partial update}]]></xp:this.action>
</xp:eventHandler>
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:return viewScope.get( "allLanguages" );}]]></xp:this.value>
</xp:selectItems>
</xp:checkBoxGroup>
<xp:repeat id="repeat1" rows="30" var="varcollection" repeatControls="true">
<xp:this.value><![CDATA[#{javascript:return viewScope.get( "allLanguages" );}]]></xp:this.value>
<xp:span>
<xp:this.rendered><![CDATA[#{javascript:var vec:java.util.Vector = viewScope.get( "selectedLanguages" );
return @IsMember(varcollection,vec);
}]]></xp:this.rendered>
<xp:label id="label1">
<xp:this.value><![CDATA[#{javascript:return varcollection + ": ";}]]></xp:this.value>
</xp:label>
<xp:inputText id="inputText1" loaded="true">
<xp:this.value><![CDATA[${javascript:var fieldName = "Help_" + varcollection;
return '#{viewScope.' + fieldName + '}';}]]></xp:this.value>
<xp:eventHandler event="onchange" submit="true"
refreshMode="partial" refreshId="computedField1">
</xp:eventHandler></xp:inputText>
  <xp:text escape="true" id="computedField4"><xp:this.value><![CDATA[#{javascript:var fieldName = "Help_" + varcollection;
return '#{viewScope.' + fieldName + '}';}]]></xp:this.value></xp:text>  
<xp:text escape="true" id="computedField1">
<xp:this.value><![CDATA[${javascript:var fieldName = "Help_" + varcollection;
return '#{viewScope.' + fieldName + '}';
}]]></xp:this.value>
</xp:text>
<xp:br></xp:br>
</xp:span>
</xp:repeat> <xp:br></xp:br>
<xp:button value="Submit" id="button1">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete" immediate="false" save="true"></xp:eventHandler></xp:button>
<xp:br></xp:br>
<xp:br></xp:br>
<xp:text escape="true" id="computedField3"><xp:this.value><![CDATA[#{javascript:return "value1 = " +viewScope["Help_de"] +
"value2 = " +viewScope["Help_en"] +
"value3 = " +viewScope["Help_pl"]}]]></xp:this.value></xp:text>
最后一个计算字段:computetdField3
将获得值'onSubmit'
和其他onChange
。
答案 1 :(得分:0)
不要使用编辑框的onChange事件进行部分刷新 - 您可以创建体验夜间母马。 Excercise 23已经满足您的所有需求。
答案 2 :(得分:0)
我因为同样的问题而捣乱了几个小时。 我从不同的视图重复构建,甚至对结果进行一些合并,以显示每行3个字段的良好输入矩阵。 我想为每个在重复中填写字段的行创建新文档。
部分刷新确实是一场噩梦。
最后,我最终使用客户端脚本onfocus
和onChange
事件将我的数据添加到页面上的隐藏字段中。我连接每行3个字段并将它们放在由§
分隔的隐藏字段中
当按下提交按钮时,我只获得服务器端隐藏字段的值@Explode("§")
,并通过新创建的数组运行并从中创建文档。