+ Start a Discussion
sherazsheraz 

question regarding creating table in visualforce page?

Hi,
I am working on creating a visualforce page on custom object. I want to include table with multiple rows and column and that has to be display as table format. as i am new to salesforce and dont know that how to include in the visualforce page and table should have following format:

 Application   
TypeDateByToComments/Notes
App rec    
Com App    
App Assing    
App routed    

please help me
thanks

harsha__charsha__c
sherazsheraz

thanks for your help and i try to follow the link that you send me but i am still stuck becuase i want to display value under "Type" colum to display as text but other colums like"Date,BY AND tO" SHOULD BE DISPLAYED as input fields.i am not able to display this as rows and field are not display as input text field.

here is the code:

<apex:pageBlockSection title="Application" collapsible="false" columns="5">
         <apex:dataTable value="{!OpportunityProduct__c}" var="c" rows="4" border="8" cellspacing="8" cellpadding="8">
         <tr>
        <apex:column headerValue="Type">
         Application Recieved
         Complete Application Recieved
         Application Assigned
         Application Routed
         </apex:column>
         
        </tr>  
         <apex:column headerValue="Date">
         {!c.Application_Received__c}
         {!c.Application_Received_Complete__c}
         {!c.Application_Date_Assigned__c}
         {!c.Application_Routed_Date__c}
         </apex:column>
         
         <apex:column headerValue="By">
         {!c.Application_Received_By__c}
         {!c.Application_Received_Complete_By__c}
         {!c.Application_Assigned_By__c}
         {!c.Application_Routed_By__c}
         </apex:column>
         
         <apex:column headerValue="To">
         {!c.Application_Received_To__c}
         {!c.Application_Received_Complete_To__c}
         {!c.Application_Assigned_To__c}
         {!c.Application_Routed_To__c}
         </apex:column>
         
         <apex:column headerValue="Comments/Notes">
         {!c.Comments__c}
         </apex:column>
         
         </apex:dataTable>
         </apex:pageBlockSection>
         
         
         <apex:pageBlockSection title="Decisions" collapsible="false" columns="4">
         <apex:dataTable value="{!OpportunityProduct__c}" var="c" rows="3" border="8" cellspacing="8" cellpadding="8">
         <apex:column headerValue="Type">
         Ally Decision 
         Dealer Decision
         Bank Decision
         </apex:column>
         
         <apex:column headerValue="Date">
         {!c.Application_Ally_Decision_Date__c}
         {!c.Application_Dealer_Decision_Date__c}
         {!c.Application_Bank_Decision_Date__c}
         </apex:column>
         
         <apex:column headerValue="By">
         {!c.Application_Ally_Decision__c}
         {!c.Application_Dealer_Decision__c}
         {!c.Application_Bank_Decision__c}
         </apex:column>
         
         <apex:column headerValue="Comments/Notes">
         {!c.Comments__c}
         </apex:column>
         
         </apex:dataTable>
         </apex:pageBlockSection>
         
          <apex:pageBlockSection title="Setup/Docs" collapsible="false" columns="5">
         <apex:dataTable value="{!OpportunityProduct__c}" var="c" rows="8" border="8" cellspacing="8" cellpadding="8">
         
         <apex:column headerValue="Type">
         Drafting
         Smart Auction
         Docs Prepared
         Docs Sent
         Docs Received
         Setup Assigned
         Dealer Established
         Processing Complete
         </apex:column>
         
         <apex:column headerValue="Date">
         {!c.Drafting_Date__c}
         {!c.Smart_Auction_Date__c}
         {!c.Docs_Prepared_Date__c}
         {!c.Docs_Sent_Date__c}
         {!c.Docs_Received_Date__c}
         {!c.Set_Up_Assigned_Date__c}
         {!c.Dealer_Established_Date__c}
         {!c.Processing_Complete__c}
         </apex:column>
         
         <apex:column headerValue="By">
         {!c.Drafting_By__c}
         {!c.Smart_Auction_By__c}
         {!c.Docs_Prepared_By__c}
         {!c.Docs_Sent_By__c}
         {!c.Docs_Sent_By__c}
         {!c.Docs_Received_By__c}
         {!c.Set_Up_Assigned_By__c}
         {!c.Dealer_Established_By__c}
         {!c.Processing_Complete_By__c}
         </apex:column>
         
         <apex:column headerValue="To">
         {!c.Drafting_To__c}
         {!c.Smart_Auction_To__c}
         {!c.Docs_Sent_To__c}
         {!c.Set_Up_Assigned_To__c}
         </apex:column>
         
         <apex:column headerValue="Comments/Notes">
         {!c.Comments__c}
         </apex:column>
         
         </apex:dataTable>
         </apex:pageBlockSection>
              

please help me

thanks

 

harsha__charsha__c

For this you can use simple html table in the page..!

 

sherazsheraz

Could you please help me out for this or how can i use Html table in the page.

I am new to visualforce development.

please help

thanks

 

harsha__charsha__c

Create a html page with the table as you need and copy & paste the same table component in the page within the <apex:form> component

sherazsheraz

I create a table using Html but the problem is now that the field is vertically displayed instead of horizantially.ideallt, it should display like:

             Application   
TypeDateByToComments/Notes
App rec    
Com App    
App Assing

here is current the screen shot:

<apex:pageBlockSection title="Application" collapsible="false" columns="5">
         <apex:dataTable value="{!OpportunityProduct__c}" var="c" rows="4" border="8" cellspacing="10" cellpadding="10">
         
         
         <tr>
              <apex:column headerValue="Type">
               Application Recieved
              </apex:column>
              <apex:column headerValue="Date">
              <apex:inputField value="{!c.Application_Received__c}"/>
              </apex:column>
              <apex:column headerValue="By">
              <apex:inputField value="{!c.Application_Received_By__c}"/>
              </apex:column>
              <apex:column headerValue="To">
              <apex:inputField value="{!c.Application_Received_To__c}"/>
              </apex:column>
              <apex:column headerValue="Comments/Notes">
              <apex:inputField value="{!c.Comments__c}"/>
              </apex:column>
          </tr> 
          
          <tr>
               <apex:column headerValue="Type">
               Complete Application Recieved
               </apex:column>
               <apex:column headerValue="Date">
               <apex:inputField value="{!c.Application_Received_Complete__c}"/>
               </apex:column>
               <apex:column headerValue="By">
               <apex:inputField value="{!c.Application_Received_Complete_By__c}"/>
               </apex:column>
               <apex:column headerValue="To">
               <apex:inputField value="{!c.Application_Received_To__c}"/>
               </apex:column>
               <apex:column headerValue="Comments/Notes">
               <apex:inputField value="{!c.Comments__c}"/>
               </apex:column>
         </tr> 
          
         <tr>
               <apex:column headerValue="Type">
                Application Assigned
               </apex:column>
               <apex:column headerValue="Date">
               <apex:inputField value="{!c.Application_Date_Assigned__c}"/>
               </apex:column>
               <apex:column headerValue="By">
               <apex:inputField value="{!c.Application_Assigned_By__c}"/>
               </apex:column>
               <apex:column headerValue="To">
               <apex:inputField value="{!c.Application_Assigned_To__c}"/>
               </apex:column>
               <apex:column headerValue="Comments/Notes">
               <apex:inputField value="{!c.Comments__c}"/>
               </apex:column>
         </tr> 
           
         <tr>
               <apex:column headerValue="Type">
                Application Routed
               </apex:column>
               <apex:column headerValue="Date">
               <apex:inputField value="{!c.Application_Routed_Date__c}"/>
               </apex:column>
               <apex:column headerValue="By">
               <apex:inputField value="{!c.Application_Routed_By__c}"/>
               </apex:column>
               <apex:column headerValue="To">
               <apex:inputField value="{!c.Application_Routed_To__c}"/>
               </apex:column>
               <apex:column headerValue="Comments/Notes">
               <apex:inputField value="{!c.Comments__c}"/>
               </apex:column>
         </tr> 
          
please help me