5

I have an apex:outputpanel that I'd like to force to refresh from within some jquery event handlers, rather than the extreme of a complete page refresh i.e. location.reload();

Any ideas on how from an event handler (not a button or link - is a 'drop' or 'click') I would perform the equivalent of a visualforce rerender="myoutputpanel" action would be most welcome!

Cheers All.

6

You can try to use a dummy apex:actionFunction to reRender any component on the page.

<script>
    jQuery('#someId').click(function(){
        // do your stuff
        ....
        // Now call action function 
        refreshMyPanel();
    });
</script>

<apex:actionFunction name="refreshMyPanel" reRender="MyPanel" />

<apex:outputPanel id="MyPanel">
    ....
</apex:outputPanel>
2

You can use the visualforce actionFunction component, it's designed for this purpose.

A component that provides support for invoking controller action methods directly from JavaScript code using an AJAX request

http://www.salesforce.com/us/developer/docs/pages/Content/pages_compref_actionFunction.htm

<script>window.setTimeout(sayHello,2000)</script>

<apex:form>
        <!-- Define the JavaScript function sayHello-->
        <apex:actionFunction name="sayHello" action="{!sayHello}" rerender="YOUR ID HERE" />
</apex:form>

Using action={!NULL} I believe you can simply force a refresh without needing a dummy method in your controller.

2

To render apex:outputpanel by using using javascript/jquery actionFunctions are used.

Ex:

<apex:actionFunction name="doSomething" reRender="PanelToRefresh" action={!controllerMethod} />

Action Function tag is rendered as an ajax function in a visualforce page with name provided in name attribute to action function, So according to above code if this tag rendered on VF page it will have a function named doSomething() and you can call it in by any javascript function or jquery.

Fro ex:

function javascriptFunc()
{
   doSomething(); // or directly without wrapping in function
}

Basically name attrubute in actionFunction becomes ajax call function name when rendered and works exactly as <apex:commandbuttom> or <apex:commandlink> does and you can call it by adding () to it. In addition actionFunction allow variable assignments to controller which can be passed in rendered ajax call function as parameters.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.