Visualforce - ActionFunction and ActionSupport not calling action methods

Question

today i'm having some issues with actionFunction and actionSupport visualforce tag.

This is my example page:

<apex:page controller="TestLookupActionFunctionCtrl">
<apex:form id="myform">
    <apex:pageBlock>

        <!-- Test with ActionSuport - NOT WORKING! -->
        <apex:pageBlockSection title="Section 1">
            <apex:inputField value="{!c.Birthdate}">
                <apex:actionSupport event="onblur" action="{!test}" reRender="out" />
            </apex:inputField>

            <apex:outputPanel id="out" rendered="{!show}">
                <apex:inputField value="{!c.Department}" />
            </apex:outputPanel>
        </apex:pageBlockSection>

        <!-- Test with ActionFunction - NOT WORKING -->
        <apex:actionFunction name="myAction" action="{!test2}" reRender="out2" />
        <apex:pageBlockSection title="Section 2">
            <apex:inputField value="{!c2.Birthdate}" onblur="myAction()" />

            <apex:outputPanel id="out2" rendered="{!show2}">
                <apex:inputField value="{!c2.Department}" />
            </apex:outputPanel>
        </apex:pageBlockSection>

    </apex:pageBlock>
</apex:form>    

As you can see i have two pageBlockSection, each of them with an inputField to insert. I want that when user insert a value, raise the action specified by actionsupport/actionFunction tag.

This is the controller:

public class TestLookupActionFunctionCtrl {

public Contact c {get;set;}
public Contact c2 {get;set;}

public boolean show {get;set;}
public boolean show2 {get;set;}

public TestLookupActionFunctionCtrl() {
    c = new Contact();
    c2 = new Contact();
    show = false;
    show2 = false;
}

public PageReference test() {
    show = true;
    return null;
}

public PageReference test2() {
    show2 = true;
    return null;
}
}

Believe it or not, i'm not able to rerender correctly those two outputPanel :(

Could you help me please? I red on internet and the only thing that i was able to find was that both the actionFunction and actionSupport work correctly with outputPanel and both must be outside the outputPanel that are going to rerender.

Thxs guys ;)

Answer 1

When rerendering an outputpanel, you must rerender a container. Wrap your outputpanels in another outputpanel and use the outer panel when rerendering. Here is an example of an action function that may help you achieve what you're trying to accomplish.

******* VISUALFORCE ******

<apex:page controller="TestLookupActionFunctionCtrl">

<script>

  function myFunc(){
    myAction();    
  }

</script>

<apex:form id="myform">
  <apex:actionFunction name="myAction" action="{!test}" reRender="RerenderMe" />
    <apex:pageBlock >
      <apex:pageBlockSection title="Section 1">

        <!-- Change onKeyup to the event you desire. onChange, onBlur, etc.  -->
        <apex:inputField value="{!c.Department}" onKeyup="myFunc()" />

        <!-- You must rerender a container.  We wrap the conditionally rendered outputPanel in another outputPanel.  Then rerender the outer panel. -->
        <apex:outputpanel id="RerenderMe">

        <!-- Inner panel rendered based on boolean in controller -->
        <apex:outputpanel id="out" rendered="{!show}">
          <apex:outputLabel for="output" value="The Output: ">
            <apex:outputfield value="{!c.department}"/>
          </apex:outputlabel>
        </apex:outputpanel>
        </apex:outputpanel>
      </apex:pageBlockSection>
    </apex:pageBlock>
</apex:form>
</apex:page>

********* CONTROLLER **********

public class TestLookupActionFunctionCtrl {

public Contact c {get;set;}

public boolean show {get;set;}

public TestLookupActionFunctionCtrl() {
    c = new Contact();
    show = false;
}

public PageReference test() {
    show = true;
    return null;
}
}

Related post: https://developer.salesforce.com/forums/ForumsMain?id=906F0000000986vIAA