I found this question is already asked several times in different forms, but I still need some help on this, since can't get this as in the examples.

I have a JSF 2 page with PrimeFaces, and it contains the following hidden button, which I need to call on pageUnLoad from javascript.

The JSF has:

// Supposed to be hidden eventually
<h:mandButton id="doStuff" action="#{myBean.callMethod()}" />

The javascript has:

var stuff = new Object();

$(window).bind('beforeunload', function() {
    stuff.doStuff();
});

stuff.doStuff = function() {
    // var hidden = $("#doStuff"); // Incorrect
    var hidden = document.getElementById("formId:doStuff"); // Correct
    if (hidden === undefined) {
            // Some logging
    } else {
        hidden.click();
    }
}

And the managedBean has:

@ManagedBean(name = "myBean")
@RequestScoped
public class MyBean {
    public void callMethod() {
        // Do stuff
    }
}

By debugging I can see that when manually clicking the button, it fires the event correctly. I am also able to verify that the JavaScript is called correctly, it "seems" to find the element, and performs the '.click()' for it, but I do not catch any event on the server side.

I seem to be doing it as it has been instructed in other similar questions, but I lack the final result.

Any help would be appreciated, thanks.

I found this question is already asked several times in different forms, but I still need some help on this, since can't get this as in the examples.

I have a JSF 2 page with PrimeFaces, and it contains the following hidden button, which I need to call on pageUnLoad from javascript.

The JSF has:

// Supposed to be hidden eventually
<h:mandButton id="doStuff" action="#{myBean.callMethod()}" />

The javascript has:

var stuff = new Object();

$(window).bind('beforeunload', function() {
    stuff.doStuff();
});

stuff.doStuff = function() {
    // var hidden = $("#doStuff"); // Incorrect
    var hidden = document.getElementById("formId:doStuff"); // Correct
    if (hidden === undefined) {
            // Some logging
    } else {
        hidden.click();
    }
}

And the managedBean has:

@ManagedBean(name = "myBean")
@RequestScoped
public class MyBean {
    public void callMethod() {
        // Do stuff
    }
}

By debugging I can see that when manually clicking the button, it fires the event correctly. I am also able to verify that the JavaScript is called correctly, it "seems" to find the element, and performs the '.click()' for it, but I do not catch any event on the server side.

I seem to be doing it as it has been instructed in other similar questions, but I lack the final result.

Any help would be appreciated, thanks.

• javascript
• jquery
• jsf-2
• primefaces

• 1 jQuery can't call click functions that weren't defined by jQuery. You would need to send an ajax request to the server on click and then send the result of that back. Or you would need to pre populate that data into a JS variable, and serve the data from the variable on click after defining the click function with jQuery. – Ohgodwhy Commented Jul 24, 2013 at 12:55

2 Answers 2

Hidden button can be clicked by using JavaScript like

document.getElementById('doStuff').click();

However, you should be careful about naming containers. Hidden button must be enclosed by a <h:form> tag and prependid attribute of it should be set false. Otherwise you can access the button with the id formId:doStuff.

See also

Naming Container in JSF2/PrimeFaces

Cannot click hidden button by JavaScript

There is a much simpler way of calling server-side methods from javascript. Define a p:remoteCommand and Primefaces will create a JavaScript-function which you can call from inside your JavaScript-functions.

Use the following for defining the remoteCommand:

<p:remoteCommand name="doStuff" action="#{myBean.callMethod()}"/>

And then to call the bean-method on beforeunload just use:

$(window).bind('beforeunload', doStuff);