ActionSupport ReRender Not Working Outside PageBlock

Question

<apex:page controller="CreateExaminationController" >
    <apex:form >
        <apex:pageblock >
            <apex:pageblocksection >
                <apex:pageblockSectionItem >Course : </apex:pageblockSectionItem>
                <apex:pageblocksectionItem >
                    <apex:selectList value="{!selectedCourse}" size="1">
                        <apex:selectOptions value="{!AllCourses}"></apex:selectOptions>
                        <apex:actionSupport event="onchange" reRender="blockSubjects"/>
                    </apex:selectList>
                </apex:pageblocksectionItem>
            </apex:pageblocksection>

            <apex:pageblocksection id="blockSubjects" >
                <apex:pageblockSectionItem >Subjects : </apex:pageblockSectionItem>
                <apex:pageblocksectionItem >
                    <apex:selectList value="{!selectedSubject}" size="1">
                        <apex:selectOptions value="{!CourseSubject}"></apex:selectOptions>
                        <apex:actionSupport event="onchange" reRender="studentSubjectTable"/>
                    </apex:selectList>
                </apex:pageblocksectionItem>
            </apex:pageblocksection>
        </apex:pageblock>

        <apex:pageblock >
            <apex:pageblockbuttons >
                <apex:commandButton value="Process Selected" action="{!processSelected}" rerender="studentSubjectTable" />
            </apex:pageblockbuttons>
            <apex:pageblockTable id="studentSubjectTable" value="{!contacts}" var="item">
                <apex:column >
                    <apex:inputCheckbox value="{!item.selected}" />
                </apex:column>
                <apex:column value="{!item.con.Name}"/>
                <apex:column value="{!item.con.Email}"/>
                <apex:column value="{!item.con.Phone}"/>
            </apex:pageblockTable>
        </apex:pageblock>

    </apex:form>
</apex:page>

I want to rerender PageBlockTable studentSubjectTable on change of SelectList selectedSubject as well as on click of Button processSelected. But now, the PageBlockTable only rerenders after I click processSelected Button.

Answer 1

Define an id of the pageBlock (e.g. pgstudentSubjectId) and try to rerender from actionSupport and Commandbutton, instead of rendering the pageBlockTable. It should work.

<apex:selectList value="{!selectedSubject}" size="1">
       <apex:selectOptions value="{!CourseSubject}"></apex:selectOptions>
       <apex:actionSupport event="onchange" reRender="pgstudentSubjectId"/>
</apex:selectList>

<apex:pageblock id="pgstudentSubjectId">
    <apex:pageblockbuttons >
        <apex:commandButton value="Process Selected" action="{!processSelected}" rerender="pgstudentSubjectId" />
    </apex:pageblockbuttons>
    <apex:pageblockTable id="studentSubjectTable" value="{!contacts}" var="item">
        <apex:column >
            <apex:inputCheckbox value="{!item.selected}" />
        </apex:column>
        <apex:column value="{!item.con.Name}"/>
        <apex:column value="{!item.con.Email}"/>
        <apex:column value="{!item.con.Phone}"/>
    </apex:pageblockTable>
</apex:pageblock>

Answer 2

I found the solution from : Rerender pageblock on change of picklist

I'm posting my code here for future reference.

<apex:page controller="CreateExaminationController" >
    <apex:form >
        <apex:pageblock title="Course & Subject">
            <apex:pageblocksection >
                <apex:pageblockSectionItem ><apex:outputLabel >Course</apex:outputLabel></apex:pageblockSectionItem>
                <apex:pageblocksectionItem >
                    <apex:selectList value="{!selectedCourse}" size="1">
                        <apex:selectOptions value="{!AllCourses}"></apex:selectOptions>
                        <apex:actionSupport event="onchange" reRender="blockSubjects"/>
                    </apex:selectList>
                </apex:pageblocksectionItem>
            </apex:pageblocksection>

            <apex:pageblocksection id="blockSubjects" >
                <apex:pageblockSectionItem ><apex:outputLabel >Subject</apex:outputLabel></apex:pageblockSectionItem>
                <apex:pageblocksectionItem >
                    <apex:selectList value="{!selectedSubject}" size="1">
                        <apex:selectOptions value="{!CourseSubject}"></apex:selectOptions>
                        <apex:actionSupport event="onchange" reRender="studentSubjectTableBlock"/>
                    </apex:selectList>
                </apex:pageblocksectionItem>
            </apex:pageblocksection>
        </apex:pageblock>

        <apex:outputPanel id="studentSubjectTableBlock">
            <apex:pageblock title="Students" rendered="{!selectedSubject != null}">
                <apex:pageblockbuttons >
                    <apex:commandButton value="Process Selected" action="{!processSelected}" rerender="studentSubjectTable" />
                </apex:pageblockbuttons>
                <apex:pageblockTable value="{!contacts}" var="item" id="studentSubjectTable">
                    <apex:column >
                        <apex:inputCheckbox value="{!item.selected}" />
                    </apex:column>
                    <apex:column value="{!item.con.Name}"/>
                    <apex:column value="{!item.con.Email}"/>
                    <apex:column value="{!item.con.Phone}"/>
                </apex:pageblockTable>
            </apex:pageblock>
        </apex:outputPanel>
    </apex:form> 
</apex:page>

Please note the usage of rendered in PageBlock