jsf - 如何使用链接调用 bean 操作方法？ onclick 不起作用

Question

我正在尝试实现一个用户名列表，可以通过单击 UP 或 DOWN 链接重新排列。

<ul>
    <ui:repeat var="user" value="#{cc.attrs.value}">
        <li>
            #{user.name}
            <h:link outcome = "user" value = "left" onclick="#{accountController.moveDown}">
                <f:param name="id" value = "${user.id}" />
            </h:link>
        </li>

    </ui:repeat>
</ul>

这里的问题是我似乎没有正确使用 onclick 属性。这样做的正确方法是什么？

编辑:按照您的建议，我将所有链接放在一个表格中:

<h:form>
        <ui:repeat value="#{cc.attrs.value}" var = "user">
        <div class = "user">
            <h:commandLink id = "Link1" value = "Up" binding = "#{accountController.ommandLink}" action = "#{accountController.moveUserUp}">
                <f:attribute name = "userId" value = "#{user.id}" />
            </h:commandLink>
            <h:commandLink id = "Link2" value = "Down" binding = "#{accountController.commandLink}" action = "#{accountController.moveUserDown}">
                <f:attribute name = "userId" value = "#{user.id}" />
            </h:commandLink>
            <h:commandLink id = "Link3" value = "Delete" binding = "#{accountController.commandLink}" action = "#{accountController.deleteUser}">
                <f:attribute name = "userId" value = "#{user.id}" />
            </h:commandLink>
    </div>
</h:form>

托管 Bean:

private UIComponent commandLink;

public void moveUserUp(){
    Integer userId = (Integer)commandLink.getAttributes().get("userId");
    System.out.println("MOVE TAB LEFT :" + userId);
}

public void moveUserDown(){
    Integer userId = (Integer)commandLink.getAttributes().get("userId");
    System.out.println("MOVE TAB RIGHT: " + userId);
}

public void deleteUser(){
    Integer userId = (Integer)commandLink.getAttributes().get("userId");
    System.out.println("DELETE TAB: " + userId);
}

public UIComponent getCommandLink() {
    return commandLink;
}

public void setCommandLink(UIComponent commandLink) {
    this.commandLink = commandLink;
}

命令链接和托管 bean 之间的通信正在工作，但在 UI 中只显示最后一个命令链接(关闭操作)。

Answer 1

为了在单击链接时调用 bean 操作方法，您需要 <h:commandLink> .这必须包含在 <h:form> 中.

<h:form>
    <h:commandLink ... action="#{bean.action}" />
</h:form>

public String action() {
    // ...

    return "/other.xhtml";
}

在 JSF 中，只有 attributes它将 EL 表达式解释为 MethodExpression 可用于声明 Action 方法。所有其他属性都被解释为 ValueExpression 当 JSF 生成 HTML 输出时，它们会立即执行。这涵盖了onclick属性，其值实际上应该代表一个 JavaScript 函数。

如果您确实想使用 GET 链接，则将操作方法​​移至 <f:viewAction>在目标页面中。这将在目标页面的页面加载时调用。

<h:link ... outcome="/other.xhtml" />

<f:metadata>
    <f:viewAction action="#{bean.onload}" />
</f:metadata>

public void onload() {
    // ...
}

也可以看看:

When should I use h:outputLink instead of h:commandLink?

How to send form input values and invoke a method in JSF bean

How do I process GET query string URL parameters in backing bean on page load?

How to navigate in JSF? How to make URL reflect current page (and not previous one)

Following your advices I placed all the links in a form

The communication between the command Link and the managed bean is working but in the UI only the last commandLink (close action) is displayed.

您不应将多个物理上不同的组件绑定(bind)到一个相同的 bean 属性。还有 <f:attribute>在 JSF2 中传递参数是 hacky 并且不再需要。假设您使用的是 Servlet 3.0/EL 2.2 容器(您的问题历史证实您使用的是 Glassfish 3)，而不是直接将参数作为方法参数传递:

<h:commandLink id="Link1" value="Up" action="#{accountController.moveUserUp(user)}" />
<h:commandLink id="Link2" value="Down" action="#{accountController.moveUserDown(user)}" />
<h:commandLink id="Link3" value="Delete" action="#{accountController.deleteUser(user)}" />

和

public void moveUserUp(User user) {
    // ...
}

public void moveUserDown(User user) {
    // ...
}

public void deleteUser(User user) {
    // ...
}

也可以看看:

How does the 'binding' attribute work in JSF? When and how should it be used?

Invoke direct methods or methods with arguments / variables / parameters in EL