+ Start a Discussion
cedgcedg 

understand rerender outputPanel

Hi,

in my VF page, i've the following code:

<apex:repeat value="{!ad.groupCafAdvList}" var="groupadv">
	
	<apex:outputPanel id="groupOptions" layout="block" rendered="true">
		<apex:inputCheckbox style="width:20px;" id="group_Chk" value="{!groupadv.selected}" >
			<apex:actionSupport event="onchange" rerender="{!$Component.groupOptions}" /></apex:inputCheckbox>
		<apex:outputText value="{!groupadv.name}" />
		
		<apex:outputPanel id="groupcontent" layout="block" rendered="{!groupadv.selected}">
			content<br />
			content<br />
			content<br />
			content<br />
		</apex:outputPanel>
	</apex:outputPanel>
</apex:repeat>

 and it works, but normally i would like to rerender only the outputPanel with id "groupcontent" (the embedded one).

 

I don't understand why I've to rerender the embedding outputPanel.

 

Can anybody explain it to me ?

 

Thanks

Best Answer chosen by Admin (Salesforce Developers) 
jwetzlerjwetzler

When your Visualforce markup is converted to HTML, any rendered attributes are evaluated, and if they are false, the components are not converted to HTML and thus are not included in your markup. This means that there is nothing with the id of "groupcontent" on your page if the initial value of {!groupadv.selected} is false.

 

When an AJAX request is made to rerender some portion of your page via the element's id, it will not be able to find the "groupcontent" div or span element on your page because it does not exist in the HTML.

 

Therefore you should always be rerendering a container that is always on your page, and the contents of that container are what should be conditionally rendered.

All Answers

cedgcedg

the code which is working works fine in Chrome and FF, but not in IE7. In IE7, the text "disappears", then if scroll up and down, it's displayed again ???

 

Anyone already encoutered this ?

 

Thanks for your help

cedgcedg

i made also test with some javascript, by using only display:block/none  in place of rerender. and it's the same

jwetzlerjwetzler

When your Visualforce markup is converted to HTML, any rendered attributes are evaluated, and if they are false, the components are not converted to HTML and thus are not included in your markup. This means that there is nothing with the id of "groupcontent" on your page if the initial value of {!groupadv.selected} is false.

 

When an AJAX request is made to rerender some portion of your page via the element's id, it will not be able to find the "groupcontent" div or span element on your page because it does not exist in the HTML.

 

Therefore you should always be rerendering a container that is always on your page, and the contents of that container are what should be conditionally rendered.

This was selected as the best answer
cedgcedg

thanks Jill. It sounds logical.