[SalesForce] Rendering PageBlocksectionItem Problem

I have asked the question here but this question is part of contiunation and I have a road block and this time it has to do with formatting is messing up:

I have two version of code i'm pasting here:

1) Working but the formatting is messed-up
2) Not working but the formatting is correct

1) Working but the formatting is messed-up:

<apex:pageBlockSection id="stat2" columns="2" >

<apex:actionRegion >
    <apex:pageBlockSection title="Status" id="stat" columns="2"   >            
        <apex:inputField value="{!Items__c.Is_Status__c}"> 
            <apex:actionSupport event="onclick" reRender="stat2" />
        </apex:inputField>
    </apex:pageBlockSection>  
</apex:actionRegion> 


 <apex:pageBlockSectionItem rendered="{!Items__c.Is_Status__c}"> 
    <apex:outputLabel for="url" value="{!$ObjectType.Items__c.fields.Is_Custom_URL__c.Label}"/>
    <apex:actionRegion >

        <apex:inputField value="{!Items__c.Is_Custom_URL__c}" id="url"> 
            <apex:actionSupport event="onclick" reRender="stat4,stat5"  />
        </apex:inputField>

    </apex:actionRegion>
</apex:pageBlockSectionItem>

<apex:pageBlockSection id="stat5"  >
                    <apex:pageBlockSectionItem rendered="{!items__c.Is_Status__c}"> 
                      <apex:outputLabel value="{!$ObjectType.items__c.fields.Proxy_URL__c.Label}" />
                      <apex:inputField value="{!items__c.Proxy_URL__c}" required="{!items__c.Is_Custom_URL__c}"/> 
                    </apex:pageBlockSectionItem> 
                    </apex:pageBlockSection>  

</apex:pageBlockSection>

2) Not working but the formatting is correct

<apex:pageBlockSection id="stat2" columns="2" >

<apex:actionRegion >
    <apex:pageBlockSection title="Status" id="stat" columns="2"   >            
        <apex:inputField value="{!Items__c.Is_Status__c}"> 
            <apex:actionSupport event="onclick" reRender="stat2" />
        </apex:inputField>
    </apex:pageBlockSection>  
</apex:actionRegion> 

 <apex:pageBlockSectionItem rendered="{!Items__c.Is_Status__c}"> 
    <apex:outputLabel for="url" value="{!$ObjectType.Items__c.fields.Is_Custom_URL__c.Label}"/>
    <apex:actionRegion >

        <apex:inputField value="{!Items__c.Is_Custom_URL__c}" id="url"> 
            <apex:actionSupport event="onclick" reRender="stat4,stat5"  />
        </apex:inputField>

    </apex:actionRegion>
</apex:pageBlockSectionItem>

<apex:pageBlockSectionItem id="stat4" rendered="{!items__c.Is_Status__c}"> 
  <apex:outputLabel for="Proxy" value="{!$ObjectType.items__c.fields.Proxy_URL__c.Label}" />
  <apex:actionRegion >
    <apex:inputField required="{!items__c.Is_Custom_URL__c}" value="{!items__c.Proxy_URL__c}" id="Proxy"/> 
  </apex:actionRegion> 
</apex:pageBlockSectionItem> 

</apex:pageBlockSection>

Best Answer

Yes, as it was mentioned before you could have problems with alignment and label displaying when using component actionRegion.

Following structure helps you to have proper alignment together with labels.

<apex:pageBlockSection>   
    <apex:pageBlockSectionItem >
        <apex:outputLabel for="nameId" 
            value="{!$ObjectType.Contact.fields.Name.Label}"/>
        <apex:actionRegion >
            <apex:inputField id="nameId"> 
                <apex:actionSupport />

And your particular example:

<apex:page standardController="items__c">
<apex:form >
    <apex:pageblock >
        <apex:pageBlockSection title="Status" id="stat" columns="1"   >   
            <apex:pageBlockSectionItem >
                <apex:outputLabel for="statusId" value="{!$ObjectType.Items__c.fields.Is_Status__c.Label}"/>
                <apex:actionRegion >
                    <apex:inputField value="{!Items__c.Is_Status__c}" id="statusId"> 
                        <apex:actionSupport event="onclick" reRender="section" />
                    </apex:inputField>
                </apex:actionRegion> 
            </apex:pageBlockSectionItem>
        </apex:pageBlockSection>  
        <apex:pageBlockSection id="section" columns="2" >
            <apex:pageBlockSectionItem rendered="{!Items__c.Is_Status__c}"> 
                <apex:outputLabel for="urlId" value="{!$ObjectType.Items__c.fields.Is_Custom_URL__c.Label}"/>
                <apex:actionRegion >
                    <apex:inputField value="{!Items__c.Is_Custom_URL__c}" id="urlId"> 
                        <apex:actionSupport event="onclick" reRender="section"  />
                    </apex:inputField>
                </apex:actionRegion>
            </apex:pageBlockSectionItem>
            <apex:pageBlockSectionItem rendered="{!Items__c.Is_Status__c}"> 
                <apex:outputLabel for="proxyId" value="{!$ObjectType.items__c.fields.Proxy_URL__c.Label}" />
                <apex:actionRegion >
                    <apex:inputField required="{!items__c.Is_Custom_URL__c}" value="{!items__c.Proxy_URL__c}" id="proxyId"/> 
                </apex:actionRegion> 
            </apex:pageBlockSectionItem> 
        </apex:pageBlockSection>
    </apex:pageblock>
</apex:form>
</apex:page>
Related Topic