Visualforce Required Fields and rerender

Question

I have a Visualforce page that uses actionRegion and actionSupport tags to render a section of the page based upon the value selected in a picklist field. That all works fine. However, some of the fields in the section that is rendered are conditionally required. Yet, when the value of the picklist field is changed so that those field should no longer be required, they are still preventing the rerender stating that the fields are required. Am I doing something wrong here?

VF Page:

<apex:page standardController="Case">

<style type="text/css">
    .widthClass { width: 75%; }
</style>

<apex:form >
    <apex:sectionHeader subtitle="New Case" title="Case Edit"/>
        <apex:pageBlock mode="edit" title="Case Edit">
        <apex:pageBlockButtons >
            <apex:commandButton value="Save" action="{!Save}"/>&nbsp;&nbsp;<apex:commandButton value="Cancel" action="{!Cancel}"/>
        </apex:pageBlockButtons>

        <apex:outputPanel Id="Reason">
        <apex:actionRegion>    
            <apex:pageblockSection title="Case Information" columns="2">
                <apex:inputField value="{!Case.OwnerId}"/>
                <apex:inputField value="{!Case.RecordTypeId}"/>
                    <apex:inputField value="{!Case.Case_Reason__c}">
                        <apex:actionSupport event="onchange" rerender="Reason"/>
                    </apex:inputField>
                <apex:inputField value="{!Case.Origin}"/>
                <apex:inputField value="{!Case.AccountId}"/>
                <apex:inputField value="{!Case.ContactId}"/>
                <apex:inputField value="{!Case.Status}"/>
            </apex:pageblockSection>

        <apex:outputPanel id="screenshot">
        <apex:outputPanel rendered="{!IF(Case.Case_Reason__c = 'Screenshot',true,false)}">
            <apex:pageblockSection title="Screenshot Information" columns="2">
                <apex:inputField value="{!Case.Use_Case__c}" required="{!IF(Case.Case_Reason__c = 'Screenshot',true,false)}"/>
                <apex:inputField value="{!Case.Campaign_ID__c}" required="{!IF(Case.Case_Reason__c = 'Screenshot',true,false)}"/>
                <apex:inputField value="{!Case.Campaign_Name__c}"/>
                <apex:inputField value="{!Case.Screenshot_Date_Range_Start__c}"/>
                <apex:inputField value="{!Case.Screenshot_Date_Range_End__c}"/>
                <apex:inputField value="{!Case.Screenshot_Format__c}" required="{!IF(Case.Case_Reason__c = 'Screenshot',true,false)}"/>
            </apex:pageblockSection>
        </apex:outputPanel>
        </apex:outputPanel>

        </apex:actionRegion>
        </apex:outputPanel>        

        </apex:pageBlock>

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

Answer 1

Try specifying immediate="true" on your actionSupport tag. Without that attribute, the visualforce page will try to submit the form to the server, which will trigger the page validation. Specifying this tag will prevent the form submission, and rerender the section.

From the actionSupport documentation:

A Boolean value that specifies whether the action associated with this component should happen immediately, without processing any validation rules associated with the fields on the page. If set to true, the action happens immediately and validation rules are skipped. If not specified, this value defaults to false.