+ Start a Discussion
Andrew Hoban 6Andrew Hoban 6 

Re-rendering different fields in the same position and keepig the right page alignment/style?

HI,

I am tryig to rerender differentfields int he same position depinging on a picklist value. This should be in the same page block section. I am having 2 issues with this:

1) The allignment and style is not correct. I have read you have to wrap the output label and input field in a PageBlockSectionItem which i have attempted, but am hving no luck.

2) I cannot rerender the fields to be in the same position as each other. One one of these field will be visiable at a time, so I would like the posisiton to stay the same for each. Whenever i attempt this, One field is in the correct posision and the other is over to the right.

The section on my code is as follows:
 
<apex:pageBlockSectionItem >
                <apex:outputLabel value="Category Detail" for="RegPickList" />  
   <apex:actionRegion >
               <apex:inputField value="{!case.Category_Detail_IT_Help_Desk__c}" required="true">
                       <apex:actionSupport event="onchange" reRender="rerenderLabelChange, RegPickList HardwareAsset, OtherSoftware" />  
                </apex:inputField> 
                  </apex:actionRegion>
                   </apex:pageBlockSectionItem> 
                 <apex:pageBlockSectionItem > 
  </apex:pageBlockSectionItem> 
 
<apex:outputPanel id="rerenderLabelChange" >
<apex:pageBlockSectionItem > 
  <apex:outputLabel value="Hardware Asset" for="HardwareAsset"  rendered="{!case.Category_Detail_IT_Help_Desk__c == 'Laptop'}" />
  <apex:inputField value="{!case.Hardware_Asset__c}" label="Hardware Asset"  id="HardwareAsset" rendered="{!Case.Category_Detail_IT_Help_Desk__c == 'Laptop'}"  /> 

 </apex:pageBlockSectionItem> 
 
 <apex:pageBlockSectionItem > 
  <apex:outputLabel value="Hardware Asset" for="OtherSoftware" rendered="{!case.Category_Detail_IT_Help_Desk__c == 'Other Software'}" />   
    <apex:inputField value="{!case.Other_Software__c}" label="Other Software"  id="OtherSoftware" rendered="{!Case.Category_Detail_IT_Help_Desk__c == 'Other Software'}"   /> 
 </apex:pageBlockSectionItem> 
               
</apex:outputPanel>

 
Naval Sharma4Naval Sharma4
Hi Andrew,

Try the upadated code.
<apex:pageBlockSectionItem >
    <apex:outputLabel value="Category Detail" for="RegPickList" />  
    <apex:actionRegion >
        <apex:inputField value="{!case.Category_Detail_IT_Help_Desk__c}" required="true">
               <apex:actionSupport event="onchange" reRender="rerenderLabelChange, RegPickList HardwareAsset, OtherSoftware" />  
        </apex:inputField> 
    </apex:actionRegion>
</apex:pageBlockSectionItem> 
<apex:pageBlockSectionItem > 
</apex:pageBlockSectionItem> 
 
<apex:outputPanel id="rerenderLabelChange" >
    <apex:pageBlockSectionItem rendered="{!case.Category_Detail_IT_Help_Desk__c == 'Laptop'}"> 
      <apex:outputLabel value="Hardware Asset" for="HardwareAsset"/>
      <apex:inputField value="{!case.Hardware_Asset__c}" label="Hardware Asset"  id="HardwareAsset"/> 
    </apex:pageBlockSectionItem> 
    <apex:pageBlockSectionItem rendered="{!case.Category_Detail_IT_Help_Desk__c != 'Laptop'}"> 
    </apex:pageBlockSectionItem> 
 
    <apex:pageBlockSectionItem rendered="{!case.Category_Detail_IT_Help_Desk__c == 'Other Software'}"> 
      <apex:outputLabel value="Hardware Asset" for="OtherSoftware" />   
        <apex:inputField value="{!case.Other_Software__c}" label="Other Software"  id="OtherSoftware"/> 
    </apex:pageBlockSectionItem> 
    <apex:pageBlockSectionItem rendered="{!case.Category_Detail_IT_Help_Desk__c != 'Other Software'}"> 
    </apex:pageBlockSectionItem>           
</apex:outputPanel>

Let me know if it works for you.

Thanks,
Naval
Andrew Hoban 6Andrew Hoban 6
Hi Naval, thanks for the reply. 

That seems to have solved problem 2! Both fields are in the same position depending on the picklist value.

The problem that still remains is the allignment/styling (see image). Thanks!

User-added image
Naval Sharma4Naval Sharma4
Updated code.
 
<apex:pageBlockSectionItem >
    <apex:outputLabel value="Category Detail" for="RegPickList" />  
    <apex:actionRegion >
        <apex:inputField value="{!case.Category_Detail_IT_Help_Desk__c}" required="true">
               <apex:actionSupport event="onchange" reRender="RegPickList, HardwareAsset, OtherSoftware" />  
        </apex:inputField> 
    </apex:actionRegion>
</apex:pageBlockSectionItem> 

 
    <apex:pageBlockSectionItem id="HardwareAsset" rendered="{!case.Category_Detail_IT_Help_Desk__c == 'Laptop'}"> 
      <apex:outputLabel value="Hardware Asset" for="HardwareAsset"/>
      <apex:inputField value="{!case.Hardware_Asset__c}" label="Hardware Asset"  id="HardwareAsset"/> 
    </apex:pageBlockSectionItem> 
    <apex:pageBlockSectionItem rendered="{!case.Category_Detail_IT_Help_Desk__c != 'Laptop'}"> 
    </apex:pageBlockSectionItem> 
 
    <apex:pageBlockSectionItem id="OtherSoftware" rendered="{!case.Category_Detail_IT_Help_Desk__c == 'Other Software'}"> 
      <apex:outputLabel value="Hardware Asset" for="OtherSoftware" />   
        <apex:inputField value="{!case.Other_Software__c}" label="Other Software"  id="OtherSoftware"/> 
    </apex:pageBlockSectionItem> 
    <apex:pageBlockSectionItem rendered="{!case.Category_Detail_IT_Help_Desk__c != 'Other Software'}"> 
    </apex:pageBlockSectionItem>

 
Andrew Hoban 6Andrew Hoban 6
Hi Naval, this updated code doesnt seem to be displaying the fields now. Thanks