java - 使用来自多个 selectOneMenus 和按钮的内容填充 inputTextArea

Question

我想构建一个小型 UI，它将使用户能够以更简单的方式编写一些数学公式(因此是 UI)，并能够将它们保存到 .txt (或类似的)文件中。

例如:我有 3 个提供各种选项的选择框、一些代表数学运算的按钮和一个 inputTextArea。到目前为止，我已经成功链接了每个 selectOneMenu 和一些 inputText 中选定的内容，并将它们与我需要的内容连接起来，并将创建的数学公式写入 .txt 文件。

现在我想为用户提供查看他正在编写的公式的可能性(通过选择内容并按下按钮)。到目前为止，我一直在尝试使用 inputTextArea 来做到这一点，但我所能做到的最好的是将所选内容从仅一个 selectOneMenu 传输到 textArea，然后我尝试添加用户的每个操作使文本区域失败(有人建议使用 <h:panelGroup> 但我无处可去，我尝试将用于填充菜单的所有 bean 合并到一个 bean 中，并以某种方式从那里开始，但这也不起作用)。

到目前为止我一直在研究的 JSF 部分的示例，其中包含 2 个选择框和 TextArea:

<h:outputText value="Formula Name"></h:outputText>
<h:inputText value="#{output.formulaName}" id="formulaName"></h:inputText>              
<br /><br />

The formula so far:
<h:inputTextarea value="#{output.propertyReferenceValue}"></h:inputTextarea>
<br/><br/><br/>

Property1:
<h:selectOneMenu  value ="#{output.propertyReferenceValue}" id="selectTwo"  
    valueChangeListener="#{output.propertyReferenceValueChanged}" onchange="submit()">
    <f:selectItems value="#{property.propertyReference}"/>              
</h:selectOneMenu>
<br/><br/>
Property2:         
<h:selectOneMenu value ="#{output.property2ReferenceValue}" id="selectThree"  
    valueChangeListener="#{output.property2ReferenceChangedValue}" onchange="submit()">
    <f:selectItems value="#{property2.property2Refference}" />            
</h:selectOneMenu>

如有任何帮助，我们将不胜感激。

PS。我对 JSF 非常陌生(大约 2 天前开始)，所以我什至会很感激有人指出一些可能涵盖此问题或类似问题的文档。

Answer 1

你基本上是在滥用 valueChangeListener这里。您对值更改并不完全感兴趣(即您对新旧值都不感兴趣)，您只对提交的值感兴趣。当您没有/不能/不会使用基于 ajax 的组件库时，JSF 1.x 中可以容忍这种情况。有(相当复杂)的方法可以解决您的特定问题 valueChangeListener ，但是在带有内置 ajax 功能的 JSF 2.x 中，这确实不能再这样做了。您应该使用 <f:ajax>标签引入异步提交和部分更新。

按如下方式重写您的 View :

Formula name:
<h:inputText value="#{output.formulaName}" id="formulaName" />
<br/><br/>

The formula so far:
<h:inputTextarea id="formula" value="#{output.propertyReferenceValue}#{output.property2ReferenceValue}"></h:inputTextarea>
<br/><br/>

Property1:
<h:selectOneMenu value="#{output.propertyReferenceValue}" id="selectTwo">
    <f:selectItems value="#{property.propertyReference}"/>
    <f:ajax render="formula" />
</h:selectOneMenu>
<br/><br/>

Property2:         
<h:selectOneMenu value ="#{output.property2ReferenceValue}" id="selectThree">
    <f:selectItems value="#{property2.property2Refference}" />            
    <f:ajax render="formula" />
</h:selectOneMenu>

仅此而已。您的#{output} bean 应该放在 View 范围内 @ViewScoped 。不需要额外的监听器方法。仅当您想在显示值之前对其进行操作时，才需要一个 ajax 监听器。例如

Formula name:
<h:inputText value="#{output.formulaName}" id="formulaName" />
<br/><br/>

The formula so far:
<h:inputTextarea id="formula" value="#{output.formula}"></h:inputTextarea>
<br/><br/>

Property1:
<h:selectOneMenu value="#{output.propertyReferenceValue}" id="selectTwo">
    <f:selectItems value="#{property.propertyReference}"/>
    <f:ajax listener="#{output.calculateFormula}" render="formula" />
</h:selectOneMenu>
<br/><br/>

Property2:         
<h:selectOneMenu value ="#{output.property2ReferenceValue}" id="selectThree">
    <f:selectItems value="#{property2.property2Refference}" />            
    <f:ajax listener="#{output.calculateFormula}" render="formula" />
</h:selectOneMenu>

例如(这个启动示例在逗号上进行了简单的连接，但是您可以完全自由地按照您想要的方式构建 formula 值):

public void calculateFormula() {
    formula = propertyReferenceValue + ", " + property2ReferenceValue;
}