【问题标题】:Pass a value from h:outputLink to JSF after onclick event在 onclick 事件之后将值从 h:outputLink 传递给 JSF
【发布时间】:2011-08-27 14:00:29
【问题描述】:

h:outputLink 上的onclick 事件之后,我需要将一个整数传递给JSF 支持bean。

重要提示:我不能使用 f:param 将值作为请求参数传递给导航页面,因为我正在阻止 h:outputlink 的默认 onclick 行为。 控件不是导航到由 href 属性定义的页面,而是转到一个 javascript 函数

在 JSF 2.0 中使用 Primefaces 3.0M3 快照


我的代码如下:

<h:outputLink id="#{item.id}" value="/itemDetails.xhtml" class="itemLink" >
      #{item.name}
</h:outputLink>


<script>
$(".itemLink").click(function(event) {
  showDetailsInDialog();// show the item details in dialog 
  event.preventDefault();// prevent the behaviour provided by href
});
</script>


<h:form>
    <p:remoteCommand name="showDetailsInDialog" update="itemDetailsPanel" oncomplete="itemDetailsDialog.show()">
        <f:setPropertyActionListener value="....id of the item...." target="#{itemsList.selectedItem}"/>
    </p:remoteCommand>
</h:form>

我有一个可重复使用的dialog,它显示从项目列表中选择的项目的详细信息。为此,当单击元素的 h:outputLink 时,需要将该项目的 id 传递给 JSF 以在 dialog 中呈现适当的内容。

如上图如果能得到remotecommand中的item的id,就可以通过setPropertyActionListener传递给合适的backing bean

【问题讨论】:

  • 如果您使用 PrimeFaces,请查看 p:remoteCommand 组件,它会生成一个 Javascript 函数来调用 backing-bean 方法。
  • @BheshG:谢谢!是的,我正在使用 primefaces 并且我也尝试过使用 remotecommand,但我不知道如何将值从 h:outputLink 传递到 f:setPropertyActionListenerp:remoteCommand 内。如果您能帮助我提供一个示例代码,那就太好了!
  • 考虑我在 JSF 支持 bean 中有 h:outputLink 中的值。
  • 你能发布你的代码(视图和bean)吗?
  • @BheshG:我已经在上面发布了我的代码。谢谢!

标签: jsf jsf-2 richfaces primefaces


【解决方案1】:

我认为您应该使用p:commandLink 而不是h:outputLink,如下所示-

查看-

<h:form>
    <p:commandLink value="#{item.name}" action="#{myBean.fetchItem()}" update="detailPanel" oncomplete="detailDlg.show();">
        <f:setPropertyActionListener target="#{myBean.itemId}" value="#{item.id}"/>
    </p:commandLink>
</h:form>

豆子-

@ManagedBean
@ViewScoped
public class MyBean {

    @ManagedProperty(value="#{itemStore}")
    private ItemStore itemStore;

    private int itemId; //getter/setter
    private Item item;  //getter/setter

    public void fetchItem() {
        this.item = this.itemStore.getItemWithId(this.itemId);
    }

更新:

您可以使用 JQuery 来做到这一点,如下所示 -

<script>
    jQuery(document).ready(function() {
            jQuery(".itemLink").click(function(event){
                jQuery("#itemIdHI").attr("value", jQuery(this).attr("id"));
                remCom();
                event.preventDefault();
            });
        });
</script>

<h:form prependId="false">
    <h:inputHidden id="itemIdHI" value="#{myBean.itemId}"/>
    <p:remoteCommand name="remCom" action="#{myBean.axnMethod()}" process="itemIdHI" update="detailPanel" oncomplete="detailDlg.show()"/>
</h:form>

【讨论】:

  • 事实上我之前使用的是 p:commandLink 但我现在想使用 outputLink 来创建可收藏的 url,除了允许像“在新标签中打开”这样的反向点击选项
  • 我对我的情况有一些提示。我还可以使用 remoteCommand 将值从 js 传递给支持 bean。现在,我无法弄清楚如何向 remoteCommand 提供/接收参数
  • @Marcos:我已经更新了答案。我不确定这是否是正确的方法,但它似乎有效。基本上,在带有 p:remoteCommand 的表单内有一个隐藏输入(使用 el 绑定到支持 bean 项目属性),并在调用 remoteCommand 之前使用 jQuery 更新隐藏输入的 value 属性。也不要忘记处理 remoteCommand 调用上的隐藏输入。
【解决方案2】:

检查this。我和你有同样的问题,但我在阅读BalusC的链接后解决了。

简而言之,你在说什么:

f:attribute: 带有 h:commandLinkh:commandButton 标签,您还可以触发使用 actionListener 属性的支持 bean 的方法。有了这个,您还可以使用 f:attribute 标记来动态传递参数。这是一个例子:

<h:form>
    <h:commandLink value="Click here" actionListener="#{myBean.action}">
        <f:attribute name="attributeName1" value="attributeValue1" />
        <f:attribute name="attributeName2" value="attributeValue2" />
    </h:commandLink>

    <h:commandButton value="Press here" actionListener="#{myBean.action}">
        <f:attribute name="attributeName1" value="attributeValue1" />
        <f:attribute name="attributeName2" value="attributeValue2" />
    </h:commandButton>
</h:form>

可以使用父 UI 组件的 getAttributes() 来获取这些属性,而父 UI 组件又可以通过 ActionEvent 来获取>actionListener。

package mypackage;

import javax.faces.event.ActionEvent;

import net.balusc.util.FacesUtil;

public class MyBean {

    // Actions -----------------------------------------------------------------------------------

    public void action(ActionEvent event) {
        String attributeName1 = FacesUtil.getActionAttribute(event, "attributeName1");
        String attributeName2 = FacesUtil.getActionAttribute(event, "attributeName2");

        System.out.println("attributeName1: " + attributeName1);
        System.out.println("attributeName1: " + attributeName1);
    }

}

package net.balusc.util;

import javax.faces.event.ActionEvent;

public class FacesUtil {

    // Getters -----------------------------------------------------------------------------------

    public static String getActionAttribute(ActionEvent event, String name) {
        return (String) event.getComponent().getAttributes().get(name);
    }

}

变量 attributeName1attributeName2 现在应该分别包含值 attributeValue1 和 attributeValue2

请注意每个属性名称应该是唯一的,并且不应覆盖任何默认组件属性,例如“id”、“name”、“value”、“binding”、“rendered”等。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-09-01
    • 1970-01-01
    • 1970-01-01
    • 2023-04-07
    • 1970-01-01
    • 2010-12-07
    • 1970-01-01
    相关资源
    最近更新 更多