Search code examples
javajavascriptjsfajax4jsf

Handle a client component from a server during an AJAX request


In my application, i have implemented a message bar for displaying info and error message, which will close when a screen navigation occurs(a javascript function triggered by window.onunload event).

In few places, i have implemented a4j:commandButton to render a specific modalpanel, without a screen refresh. In such case, existing message bar stays(since there is no screen refresh!!!), new message bar gets appended to it.

I very well knew about the implementation of a4j:commandButton's attribute "onClick()". It may be hectic to implement it in all the existing buttons. I want a one time implementation at server side (if possible at PhaseListener), so that i need not write any onunload javascript function or an onClick() functionality.

Can anyone give me a brief idea on how to control the message bar from server side in ajax scenario.?

Thanks in advance.!!!


Solution

  • I know you asked a server side solution but there is a relatively easy client side solution to this problem which I think you might prefer.

    if you want to add a function to all or some of the button elements on "onClick" you could try using the following code.

    replace with your function to be added on the click event. replace with the name of your form (you can pass is as a parameter)

    btw, this code supports IE FF CHROME etc.

    function addFunctionToAllButtons()
    {
        var buttons = document.*YourForm*.getElementsByTagName("button"); 
        for(i=0; i<buttons.length; i++)
        {
            if(buttons[i].id =='yourButtonId')
            {
            attachEvent(buttons[i],'click',*yourFunction*,false);
            }
        }
    
    }
    
    
    function attachEvent(obj,evt,fnc,useCapture)
    {
        if (!useCapture) useCapture=false;
        if (obj.addEventListener)
        {
            obj.addEventListener(evt,fnc,useCapture);
            return true;
        }
        else if (obj.attachEvent) 
            return obj.attachEvent("on"+evt,fnc);
        else
        {
            MyAttachEvent(obj,evt,fnc);
            obj['on'+evt]=function(){ MyFireEvent(obj,evt) };
        }
    } 
    

    -- Edit

    to suuport child pages we need to take special notice to the buuton id we refer to in the following line:

    if(buttons[i].id =='yourButtonId')
    

    and to the form Id

    hope this helps.