1

As per this blog by Bob Buzzard I am trying to rerender an input field. But as I am adding that input field in two nested output panel as shown in below code and example in the above blog that input field goes off from the layout of screen. I have attached the screen shot of that too.

`<apex:pageBlock id="pb" title="Action Edit" mode="edit" >

            <apex:pageBlockButtons >
                <apex:commandButton action="{!Save}" value="Save"/>
                <apex:commandButton action="{!Cancel}" value="Cancel"/>

            </apex:pageBlockButtons>  

            <apex:pageBlockSection title="Variables" id="Variables" columns="1">                 
                <apex:pageblockSectionItem >
                    <apex:outputLabel value="Greeting" for="OppLetterGreeting"/>
                    <apex:inputField value="{!opp.Greeting__c}" id="OppLetterGreeting"/>
                </apex:pageblockSectionItem>
                <apex:outputPanel>
                    <apex:outputPanel>
                        <apex:pageblockSectionItem >
                            <apex:outputLabel value="Return Date" for="ReturnDate"/>
                            <apex:inputField value="{!opp.Letter_Return_Date__c}" id="ReturnDate"/>
                        </apex:pageblockSectionItem>
                    </apex:outputPanel>
                </apex:outputPanel>
                <apex:pageblockSectionItem >
                    <apex:outputLabel value="Admin Name" for="OppLetterFromTitle"/>
                    <apex:inputField value="{!opp.Admin_Name__c}" id="OppLetterFromTitle"/>
                </apex:pageblockSectionItem>


            </apex:pageBlockSection>

        </apex:pageBlock>`

enter image description here

6

The apex:outputPanel is messing up your output, as it causes all of its children to be rendered in the same column (it's intended to group together elements inside an apex:panelGrid).

        <apex:pageBlockSection title="Variables" id="Variables" columns="1">                 
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Greeting" for="OppLetterGreeting"/>
                <apex:inputField value="{!opp.Greeting__c}" id="OppLetterGreeting"/>
            </apex:pageblockSectionItem>
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Return Date" for="ReturnDate"/>
                <apex:inputField value="{!opp.Letter_Return_Date__c}" id="ReturnDate"/>
                    </apex:pageblockSectionItem>
            <apex:pageblockSectionItem >
                <apex:outputLabel value="Admin Name" for="OppLetterFromTitle"/>
                <apex:inputField value="{!opp.Admin_Name__c}" id="OppLetterFromTitle"/>
            </apex:pageblockSectionItem>
        </apex:pageBlockSection>

If you want to reRender a specific field, consider rendering the entire page block section instead:

reRender="Variables"

Bob's specific problem had to do with essentially unstyled code not being rendered correctly. If you render the parent element, all of the children should be regenerated correctly.


Functional self-contained example:

<apex:page standardController="Account">
    <apex:form>
        <apex:pageBlock>
            <apex:pageBlockSection>
                <apex:inputField value="{!Account.Name}" />
            </apex:pageBlockSection>
            <apex:actionRegion renderRegionOnly="true">
                <apex:pageBlockSection id="section2" columns="1">
                    <apex:inputField value="{!Account.Industry}">
                        <apex:actionSupport event="onchange" reRender="section2" />
                    </apex:inputField>
                    <apex:inputField value="{!Account.Description}" rendered="{!Account.Industry='Technology'}"/>
                    </apex:pageBlockSection>
            </apex:actionRegion>
        </apex:pageBlock>
    </apex:form>
</apex:page>

You can use an actionRegion to isolate the area(s) that are affected, then use a reRender attribute to target the item(s) you want to redraw. Feel free to play with this example to see how you can use it. The fields that drive the render attributes must be inside the actionRegion for this to work.

4
  • Thank you for your answer. It does make sense. When I am implementing this not keeping inputfield in <apex:outputpanel> it doesn't show or hide based on the value in above pick list. I have added this reRender="Variables" on onchange event of above picklist in the same section. but it is not reRendering. – Ricky Jun 7 '16 at 18:29
  • ans that was the only reason I used <apex:outputpanel> nest as suggested in that blog. – Ricky Jun 7 '16 at 18:29
  • @Ricky I wrote up a self-contained example for you. I hope this helps you out. – sfdcfox Jun 7 '16 at 20:40
  • That is so nice of you. Thank you so much for your help. That indeed cleared my doubt and solve the problem .Sorry I took long replying as I was implementing that and experimenting with that a bit. I can twist now my way to work as per org requirement. – Ricky Jun 8 '16 at 18:11

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.