How can I execute Javascript before a JSF <h:commandLink> action is performed?

javascript, jsf

Solution

<h:commandLink id="myCommandLink" action="#{myPageCode.doDelete}">
    <h:outputText value="#{msgs.deleteText}" />
</h:commandLink>
<script type="text/javascript">
if (document.getElementById) {
    var commandLink = document.getElementById('<c:out value="${myPageCode.myCommandLinkClientId}" />');
    if (commandLink && commandLink.onclick) {
        var commandLinkOnclick = commandLink.onclick;
        commandLink.onclick = function() {
            var result = confirm('Do you really want to <c:out value="${msgs.deleteText}" />?');
            if (result) {
                return commandLinkOnclick();
            }
            return false;
        }
    }
}
</script>

Other Javascript actions (like validating form input etc) could be performed by replacing the call to `confirm()` with a call to another function.

Problem

If you have a JSF `<h:commandLink>` (which uses the `onclick` event of an `<a>` to submit the current form), how do you execute JavaScript (such as asking for delete confirmation) prior to the action being performed?

Original source

Related problems