+ Start a Discussion
prady-cmprady-cm 

how to use colspan in VF pages

i have a VF page code

<apex:pageBlockSection collapsible="false"  columns="2" >

                <apex:inputField value="{!Opp.field1__c}"/> 
                <apex:inputField value="{!Opp.field2__c}"/> 
                <apex:outputField value="{!Opp.field3__c}"/>    
                <apex:outputField value="{!Opp.field4__c}"/>    
        </apex:pageBlockSection>

 I want to have a command button inside the blockSection. Can we have something like a colspan on table to merge the first line to a single column to hold the command button?

Devendra@SFDCDevendra@SFDC

 

Hi prady-cm,

 

I dont know about colspan in visualforce. But if you are using HTML Table then it is possble.

 

Try below code to hold your commandbuttons in pageblock section.

 

<apex:form >
      <apex:pageBlock mode="edit">
         <apex:pageMessages />
         <apex:pageBlockButtons>
            <apex:commandButton action="{!saveme}" value=" Save" ></apex:commandButton>
            <apex:commandButton action="{!cancelme}" value="Cancel" immediate="true"></apex:commandButton>
         </apex:pageBlockButtons>
              
         <apex:pageBlockSection title="Information" columns="2" collapsible="false"> 
              <apex:inputField value="{!Opp.field1__c}"/> 
                <apex:inputField value="{!Opp.field2__c}"/> 
                <apex:outputField value="{!Opp.field3__c}"/>    
                <apex:outputField value="{!Opp.field4__c}"/>    
         </apex:pageBlockSection>
            
      </apex:pageBlock>
   </apex:form>

 

Hope this helps.:)

 

 

Thanks,

Devendra

prady-cmprady-cm

Thanks Devendra...

 

But my command button is not for the whole page, but just for that section.

This button just would refresh this particular block after processing some conditions.

soofsoof

Try adding another pageBlockSection with one column above your pageBlockSection, and put the button in the former.

 

<apex:pageBlockSection collapsible="false" columns="1" > <apex:pageBlockSectionItem style="align:center"> <apex:commandButton action="{!doSomething}" value="go!" /> </apex:pageBlockSectionItem> </apex:pageBlockSection>

<apex:pageBlockSection collapsible="false"  columns="2" >
  <apex:inputField value="{!Opp.field1__c}"/> 
  <apex:inputField value="{!Opp.field2__c}"/> 
  <apex:outputField value="{!Opp.field3__c}"/>    
  <apex:outputField value="{!Opp.field4__c}"/>    
</apex:pageBlockSection>

 Thanks.

Devendra@SFDCDevendra@SFDC

Hi,

 

Try this 

 

<apex:commandbutton location="top/bottom/both"> </apex:commandButton>

 

You can use one of three for displaying commandButton on your VF page.

 

Next , you can use rendered attribute to display commandButton based on particular condition.

 

For e.g. 

<apex:commandbutton location="top/bottom/both" rendered="{Specify your condition}"> </apex:commandButton>

 

Thanks,

Devendra

prady-cmprady-cm

Thanks Devendra and soof.

I added a blocksectionitem with a empty output text.

 

<apex:pageBlockSection collapsible="false"  columns="2" >
                    <apex:pageBlockSectionItem >
                        <apex:outputLabel value=""></apex:outputLabel>
                    </apex:pageBlockSectionItem>
<apex:commandButton action="{!doSomething}" value="go!" />

 <apex:inputField value="{!Opp.field1__c}"/> <apex:inputField value="{!Opp.field2__c}"/> <apex:outputField value="{!Opp.field3__c}"/> <apex:outputField value="{!Opp.field4__c}"/> </apex:pageBlockSection>

 

This gave me the output which i was looking for