Pase un valor de h: outputLink a JSF después del evento onclick

I need to pass an integer to a JSF backing bean after onclick evento en h:outputLink.

Importante: I cannot use f:param to pass value as request parameters to the naviagating page as I am preventing default onclick behaviour of h:outputlink. The control instead of navigating to page defined by href attribute, goes to a javascript function.

Using Primefaces 3.0M3 snapshot with JSF 2.0


Mi código sigue:

<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>

I have a reusable dialog that displays the details of item selected from a itemslist. For this when the h:outputLink for an element is clicked the id of that item needs to be passed to JSF to render appropriate content in dialog.

As shown above If I can get the id of item in remotecommand, I can pass it to appropriate backing bean through setPropertyActionListener

preguntado el 27 de agosto de 11 a las 14:08

If you are using PrimeFaces look at the p:remoteCommand component, it generates a Javascript function to invoke backing-bean method. -

@BheshG: Thanks! Yes, I'm using primefaces & I also tried using remotecommand but I couldn't figure out how to pass value from h:outputLink a f:setPropertyActionListener dentro de p:remoteCommand. If you could assist me with a sample code that would be great! -

Consider that I have the value in h:outputLink in a JSF backing bean. -

Can you post your code (both the view and the bean)? -

@BheshG: I have posted my code above. Thanks! -

2 Respuestas

Creo que deberías usar p:commandLink en lugar de h:outputLink como sigue -

Vista -

<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>

Frijol -

@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);
    }

Actualizar:

You can do that by using JQuery as follows -

<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>

Respondido 29 ago 11, 00:08

Infact I was using p:commandLink earlier but I am now wanting to use outputLink inorder to create bookmarkable urls besides allowing the inverse click options like 'open in new tab' - Rajat gupta

I have got some hint for my case.. I can also use remoteCommand to pass value to backing bean from js. Rightnow, I cannot figure out how to supply/receive parameters to remoteCommand - Rajat gupta

@Marcos: I have updated the answer. I am not sure about whether it's the right way to do that but it seems to work. Basically, have a hidden-input (bound to the backing bean item prop using el) inside the form with the p:remoteCommand and use jQuery to update the value attribute of hidden input before invoking the remoteCommand. Also don't forget to process hidden input on remoteCommand invocation. - Bhesh Gurung

Consulta este out. I have the same problems as you, but i solved it after reading BalusCenlace de.

For short, there's what u're talking abt:

f:attribute: con h: commandLink y h: commandButton tags you can also trigger a method of the backing bean using the actionListener attribute. With this you can also use the f:attribute tag to dynamically pass the parameters. Here is an example:

<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>

Those attributes can be retrieved using getAttributes() of the parent UI component, which on its turn can be retrieved by the ActionEvent pasado por el 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);
    }

}

Las variables attributeName1 y attributeName2 now should contain the values attributeValue1 and attributeValue2 respectivamente.

Take care that each attribute name should be unique and should not overwrite any default component attributes, like "id", "name", "value", "binding", "rendered", etc.

contestado el 23 de mayo de 17 a las 14:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.