0

我有一个代表计算器的 bean 类。该类公开了 4 个方法：加法、减法、乘法和除法。

对于前端，我正在编写一个 JSP 页面。此页面包含两个文本输入框（一个用于 x，一个用于 y）。我有一个下拉菜单，用户在其中选择操作，然后有一个执行所选操作的计算命令按钮。

<h:form>
    <h:inputText value="#{calcBean.x}"></h:inputText>
    <h:inputText value="#{calcBean.y}"></h:inputText>
    <h:selectOneMenu>
        <f:selectItem itemValue="Add"></f:selectItem>
        <f:selectItem itemValue="Subtract"></f:selectItem>
        <f:selectItem itemValue="Multiply"></f:selectItem>
        <f:selectItem itemValue="Divide"></f:selectItem>
    </h:selectOneMenu>
    <h:commandButton value="Calculate" action="@SEE COMMENT">
    <%-- TODO the action of this command button needs to change depending on --%>
    <%-- the user selection. For example: If the user selects "Add" the action --%>
    <%-- needs to be #{calcBean.add} --%>
    </h:commandButton>
</h:form>

我遇到的问题是我不知道如何根据用户选择更改命令按钮的操作。

我可以用四个不同的命令按钮来做到这一点，但这不是一个优雅的解决方案：

<h:form>
    <h:inputText value="#{calcBean.x}"></h:inputText>
    <h:inputText value="#{calcBean.y}"></h:inputText>
    <br/>
    <h:commandButton value="Add" action="#{calcBean.add}"></h:commandButton>
    <h:commandButton value="Subtract" action="#{calcBean.subtract}"></h:commandButton>
    <h:commandButton value="Multiply" action="#{calcBean.multiply}"></h:commandButton>
    <h:commandButton value="Divide" action="#{calcBean.divide}"></h:commandButton>
</h:form>
4

2 回答 2

1

您可以通过将用户的选择绑定到支持 bean 中的属性并使用该选定值作为您的操作方法中的条件来执行正确的计算来做到这一点。

<h:selectOneMenu value=#{calcBean.calculationType}>
    <f:selectItem itemValue="Add"></f:selectItem>
    <f:selectItem itemValue="Subtract"></f:selectItem>
    <f:selectItem itemValue="Multiply"></f:selectItem>
    <f:selectItem itemValue="Divide"></f:selectItem>
</h:selectOneMenu>

<h:commandButton value="Add" action="#{calcBean.doSelectedCalculation}"></h:commandButton>

在您的单一独特操作方法中，根据所选的计算类型，您可以对给定的 x 和 y 值进行操作。

public void doSelectedCalculation()
{
     if(calculationType.equals("Add"))
     {
          result = x + y;
     }
     else if(calculationType.equals("Subtract"))
     { 
          result = x - y;
     }
     ...

}
于 2013-01-21T22:27:00.320 回答
1

JSF-ish 方式是：

  1. 将您与托管 bean 中的属性绑定<h:selectOneMenu>，比方说int selectedOption.

  2. <f:selectItem>设置向用户显示的选项 ( ) 的值。它可以是 1、2、3 和 4（仅作为基本示例）

  3. calculate从托管 bean 中公开一个方法。此方法将在您的<h:commandButton>操作属性中。这个方法会使用selectedOption属性来知道要使用什么操作。

有了这些信息，结果将是：

JSF 代码

<h:form>
    <h:inputText value="#{calcBean.x}" />
    <h:inputText value="#{calcBean.y}" />
    <h:selectOneMenu value="#{calcBean.selectedOption}">
        <f:selectItem itemLabel="Add" itemValue="1" />
        <f:selectItem itemLabel="Subtract" itemValue="2" />
        <f:selectItem itemLabel="Multiply" itemValue="3" />
        <f:selectItem itemLabel="Divide" itemValue="4" />
    </h:selectOneMenu>
    <h:commandButton value="Calculate" action="#{calcBean.calculate}" />
</h:form>
Result: <h:outputText value="#{calcBean.result}" />

CalcBean 代码

public class CalcBean {

    private int x;
    private int y;
    private int selectedOption;
    private double result;
    //constructor...
    //getters and setters...

    public String calculate() {
        result = 0;
        switch(selectedOption) {
            case 1:
                result = x + y;
                break;
            //write the other cases...
        }
        return null;
    }
}

上面的代码对应 JSF 1.2。如果您使用的是 JSF 2.x，那么您应该停止使用 JSP 并转移到 Facelets，如JSF wiki 中所述。恕我直言，学习 JSF 2 而不是 JSF 1.x 会更好。

于 2013-01-21T22:33:45.283 回答