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
Aron Schor [Dev]Aron Schor [Dev] 

Help with formatting a VF page (spacing issue)

Hi,
This is probably easy but I am a newbie and basically partially edited other code so not sure how to correct this issue.

IMAGE
OSHA

ISSUES:
There is no spacing or ideally other columns dividing the information.
There is no title.  Simply having the Name, ProductCode, Description, Notes would be fine.
I don't need the Product Id section but I tried using that info as it shows the Title.

I tried doing some searching and something called </apex:pageBlockSectionItem> but maybe that's for something else or I didn't use it properly.

CODE:
<apex:page standardController="Product2" extensions="prodsearchcontroller">  
  <apex:form >  
 <apex:inputText value="{!searchstring}" label="Input"/>   
  <apex:commandButton value="Search records" action="{!search}"/>  
  <apex:commandButton value="Clear records" action="{!search}"/>  
   <apex:pageBlock title="Search Result">  
    <apex:pageblockTable value="{!prod}" var="a">  
  <apex:column >  
      <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">{!a.Name}</apex:outputlink>  
      <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">{!a.ProductCode}</apex:outputlink>  
      <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">{!a.Description}</apex:outputlink>  
      <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">{!a.Notes__c}</apex:outputlink>  
     </apex:column>  
     <apex:column value="{!a.id}"/>  
    </apex:pageBlockTable>     
   </apex:pageBlock>   
  </apex:form>  
 </apex:page>

Thanks.

Best Answer chosen by Aron Schor [Dev]
sfdcdevsfdcdev

Try the below snippet:
 
<apex:pageBlock title="Search Result">  
       <apex:pageblockTable value="{!prod}" var="a">  
             <apex:column headerValue="Name">  
                    <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                             {!a.Name}
                   </apex:outputlink>  
            </apex:column > 
            <apex:column headerValue="Product Code">
                 <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                            {!a.ProductCode}
                 </apex:outputlink>  
           </apex:column > 
           <apex:column headerValue="Description"> 
                 <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                          {!a.Description}
               </apex:outputlink>  
            </apex:column > 
            <apex:column headerValue="Notes">
                  <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                           {!a.Notes__c}
                  </apex:outputlink>  
            </apex:column>  
            <apex:column value="{!a.id}"/>  
    </apex:pageBlockTable>


 

All Answers

Maciej SobkowiczMaciej Sobkowicz
Hi Aron,
The problem in your code and solution is that you use single column to wrap multiple fields. You should use
<apex:column>
to wrap each
<apex:outputLink>
This will automatically give you spacing, columns, titles.

You can see documentation and example here: http://www.salesforce.com/docs/developer/pages/Content/pages_compref_column.htm

Regards,
sfdcdevsfdcdev

Try the below snippet:
 
<apex:pageBlock title="Search Result">  
       <apex:pageblockTable value="{!prod}" var="a">  
             <apex:column headerValue="Name">  
                    <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                             {!a.Name}
                   </apex:outputlink>  
            </apex:column > 
            <apex:column headerValue="Product Code">
                 <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                            {!a.ProductCode}
                 </apex:outputlink>  
           </apex:column > 
           <apex:column headerValue="Description"> 
                 <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                          {!a.Description}
               </apex:outputlink>  
            </apex:column > 
            <apex:column headerValue="Notes">
                  <apex:outputlink value="https://ap1.salesforce.com/{!a.id}">
                           {!a.Notes__c}
                  </apex:outputlink>  
            </apex:column>  
            <apex:column value="{!a.id}"/>  
    </apex:pageBlockTable>


 
This was selected as the best answer
Aron Schor [Dev]Aron Schor [Dev]
Thanks, its working now!!