function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Vivek KidambiVivek Kidambi 

Visualforce display issue

I have a pageblock table and multiple columns in it. I need to display a input text and an image (based on rendered condition) in a column but i have issues with white spaces when i use a panel grid inside column. 

Here is the code
<apex:column headerValue="Sample">
<apex:panelGrid columns="2">
<apex:inputSecret styleClass="pwd" style="width:90px; height:25px;" rendered="{!testcondition}"/>
<apex:image url="{!URLFOR($Resource.Images, 'sample.png')}" title="Click here.." rendered="{testcondition1}"/>
</apex:panelGrid>                                        
<apex:image url="{!URLFOR($Resource.Images, 'sample1.png')}" title="#2.." rendered="{testcondition2}"/>
<apex:image url="{!URLFOR($Resource.Images, 'sample2.png')}" title="#3.." rendered="{testcondition3}"/>
</apex:column>

Screenshot
Best Answer chosen by Vivek Kidambi
Vivek KidambiVivek Kidambi
i found a workaround. I added another column and displayed the image in that column based on rendered condition. That kind of solved the problem. Still wondering why pagegrid shows up a white space when there is no value. 

All Answers

William TranWilliam Tran
Is this only happenning when nothing is rendered? that is you have an empty grid?

For whatever is giving you the white space, you could wrap it (like the grid) in an outputPanel so the grid will not show up unless there is something there.
 
<apex:column headerValue="Sample">


<apex:outputPanel rendered="{!testcondition || testcondition1}">

	<apex:panelGrid columns="2">
	<apex:inputSecret styleClass="pwd" style="width:90px; height:25px;" rendered="{!testcondition}"/>
	<apex:image url="{!URLFOR($Resource.Images, 'sample.png')}" title="Click here.." rendered="{testcondition1}"/>
	</apex:panelGrid>   

</apex:outputPanel>
                                     
<apex:image url="{!URLFOR($Resource.Images, 'sample1.png')}" title="#2.." rendered="{testcondition2}"/>
<apex:image url="{!URLFOR($Resource.Images, 'sample2.png')}" title="#3.." rendered="{testcondition3}"/>
</apex:column>

thx.


 
Vivek KidambiVivek Kidambi
tried that. it still show up white space. 
William TranWilliam Tran
You need to figure out what causing the white space and that and wrap it in a outputpanel.

Can you send the whole code? it's hard to help you debug if I can see a little snippet of it.

What you can do is to expand the output panel include the images and other items too.

Once you figure out he culprit, it's easy to take take of. 

NOTE you can create as many outputpanel as you like, one for the pwd, one for the images etc.

Thx.
Vivek KidambiVivek Kidambi
i found a workaround. I added another column and displayed the image in that column based on rendered condition. That kind of solved the problem. Still wondering why pagegrid shows up a white space when there is no value. 
This was selected as the best answer