+ Start a Discussion
Supriyo Ghosh 5Supriyo Ghosh 5 

Grid view and page as landscape

Hi,

I want to add grid in my vf page and also show as landscape mode.Please help.

My vf page
<apex:page id="p1" standardController="Employee_Master__c" extensions="EmpMasterReport" sidebar="false" 
        renderAs="PDF" showHeader="false">
     <apex:form >
        <apex:pageBlock title="Employee Master Details" id="Emp_Master">
            <apex:pageBlockTable value="{! EmpList }" var="em">
                <apex:column value="{!em.Name}"/>
                
                <apex:column value="{!em.Address__c}"/>
                
                <apex:column value="{!em.Date_Of_Birth__c}"/>
                
                <apex:column value="{!em.Date_Of_Joining__c}"/>
                
                <apex:column value="{!em.Date_of_Leaving__c}"/>
                
                <apex:column value="{!em.Thumbnail__c}"/>
            </apex:pageBlockTable>
        </apex:pageBlock>
    </apex:form>
    
</apex:page>
Best Answer chosen by Supriyo Ghosh 5
Maharajan CMaharajan C
Hi Supriyo,

Can you please change the Visual force page like Below mentioned:(This is my example VF code part of the code from you so change the code depend your requirement)

<apex:page id="p1" standardController="Employee_Master__c" extensions="EmpMasterReport" sidebar="false" 
         renderAs="pdf"  showHeader="false">
        
         <apex:stylesheet value="{!$Resource.ExpensePDF}"/>
 <apex:form >
     
 <apex:pageBlock title="Employee Master Details" id="Emp_Master">
 <apex:dataTable value="{!EmpList}" var="c" border="2">

<tr > <td>    <apex:column headerValue="Name" style="width:250px">
              <apex:outputField value="{!c.Name}"/>
              </apex:column></td>
      <td>    <apex:column headerValue="Address" style="width:250px">
              <apex:outputField value="{!c.Address__c}"/>
              </apex:column></td>
      <td>    <apex:column headerValue="Date of Birth" style="width:250px">
              <apex:outputField value="{!c.Date_Of_Birth__c}"/>
              </apex:column></td>
      <td>    <apex:column headerValue="Date of joinning" style="width:250px">
              <apex:outputField value="{!c.date_of_Joining__c}"/>
              </apex:column> </td>
      <td>    <apex:column headerValue="Date of leaving" style="width:250px">
              <apex:outputField value="{!c.Date_of_Leaving__c}"/>
              </apex:column> </td>
</tr>


</apex:dataTable>

        </apex:pageBlock>
    </apex:form>
   </apex:page>

Controller:

public class EmpMasterReport
{
   public List<Employee_Master__c> EmpList {get;set;}
   public EmpMasterReport(ApexPages.StandardController stdController) 
    {
        EmpList = new List<Employee_Master__c>();
        EmpList = [ SELECT Name,Address__c,Date_Of_Birth__c,date_Of_Joining__c,Date_of_Leaving__c FROM Employee_Master__c where Active__c=true];
    }
  }


And the Main thing is We need to add a stylesheet in our VFCode: For that you need to add a code in Static resources then call that in VF.This is used for Landscape.

Step 1:

Save the below code in  Notepad as Filename.css 

@page{
        size:landscape;
        margin-left: 0.8cm; 
        margin-right: 0.8cm;
        margin-top: 0.8cm; 
        margin-bottom: 0.8cm;
        @bottom-left{
            font-family:Arial, Helvetica, sans-serif;
            font-size: 12pt;
            content: "Company"; 
        }
    
        @bottom-center{
            font-family:Arial, Helvetica, sans-serif;
            font-size: 8pt;
            content: counter(page) " of " counter(pages); 
        }
        @bottom-right{
            font-family:Arial, Helvetica, sans-serif;
            font-size: 8pt;
            content: "Confidential";     
        }

      }

step 2:

Setup->Static Resource->Name as (ExpensePDF)->Choose file(notepad file)->Cache control(Public)->Save




Please let me know is that helpfull to you....Or you need any further help...
Its correct means mark this as a best answer...


Thanks,
Raj.
(Sweet Potato Tec)

 

All Answers

Supriyo Ghosh 5Supriyo Ghosh 5
Can anyone have any idea??Please help
Maharajan CMaharajan C
Hi Supriyo,

Can you please post your controller to your VF

Thanks,
Raj.
(Sweet Potato Tec)
Supriyo Ghosh 5Supriyo Ghosh 5
public class EmpMasterReport
{
   public List<Employee_Master__c> EmpList {get;set;}
   
    public EmpMasterReport(ApexPages.StandardController stdController) 
    {
        EmpList = new     List<Employee_Master__c>();
        EmpList = [ SELECT Name,Address__c,Date_Of_Birth__c,Date_Of_Joining__c,Date_of_Leaving__c,Thumbnail__c FROM Employee_Master__c where Active__c=true and Photo__c !=null];
    }
    
    public EmpMasterReport()
    {
        EmpList = new     List<Employee_Master__c>();
        EmpList = [ SELECT Name,Address__c,Date_Of_Birth__c,Date_Of_Joining__c,Date_of_Leaving__c,Thumbnail__c FROM Employee_Master__c where Active__c=true and Photo__c !=null];
    }
   
}
Supriyo Ghosh 5Supriyo Ghosh 5
Any update??
Maharajan CMaharajan C
Hi Supriyo,

Can you please change the Visual force page like Below mentioned:(This is my example VF code part of the code from you so change the code depend your requirement)

<apex:page id="p1" standardController="Employee_Master__c" extensions="EmpMasterReport" sidebar="false" 
         renderAs="pdf"  showHeader="false">
        
         <apex:stylesheet value="{!$Resource.ExpensePDF}"/>
 <apex:form >
     
 <apex:pageBlock title="Employee Master Details" id="Emp_Master">
 <apex:dataTable value="{!EmpList}" var="c" border="2">

<tr > <td>    <apex:column headerValue="Name" style="width:250px">
              <apex:outputField value="{!c.Name}"/>
              </apex:column></td>
      <td>    <apex:column headerValue="Address" style="width:250px">
              <apex:outputField value="{!c.Address__c}"/>
              </apex:column></td>
      <td>    <apex:column headerValue="Date of Birth" style="width:250px">
              <apex:outputField value="{!c.Date_Of_Birth__c}"/>
              </apex:column></td>
      <td>    <apex:column headerValue="Date of joinning" style="width:250px">
              <apex:outputField value="{!c.date_of_Joining__c}"/>
              </apex:column> </td>
      <td>    <apex:column headerValue="Date of leaving" style="width:250px">
              <apex:outputField value="{!c.Date_of_Leaving__c}"/>
              </apex:column> </td>
</tr>


</apex:dataTable>

        </apex:pageBlock>
    </apex:form>
   </apex:page>

Controller:

public class EmpMasterReport
{
   public List<Employee_Master__c> EmpList {get;set;}
   public EmpMasterReport(ApexPages.StandardController stdController) 
    {
        EmpList = new List<Employee_Master__c>();
        EmpList = [ SELECT Name,Address__c,Date_Of_Birth__c,date_Of_Joining__c,Date_of_Leaving__c FROM Employee_Master__c where Active__c=true];
    }
  }


And the Main thing is We need to add a stylesheet in our VFCode: For that you need to add a code in Static resources then call that in VF.This is used for Landscape.

Step 1:

Save the below code in  Notepad as Filename.css 

@page{
        size:landscape;
        margin-left: 0.8cm; 
        margin-right: 0.8cm;
        margin-top: 0.8cm; 
        margin-bottom: 0.8cm;
        @bottom-left{
            font-family:Arial, Helvetica, sans-serif;
            font-size: 12pt;
            content: "Company"; 
        }
    
        @bottom-center{
            font-family:Arial, Helvetica, sans-serif;
            font-size: 8pt;
            content: counter(page) " of " counter(pages); 
        }
        @bottom-right{
            font-family:Arial, Helvetica, sans-serif;
            font-size: 8pt;
            content: "Confidential";     
        }

      }

step 2:

Setup->Static Resource->Name as (ExpensePDF)->Choose file(notepad file)->Cache control(Public)->Save




Please let me know is that helpfull to you....Or you need any further help...
Its correct means mark this as a best answer...


Thanks,
Raj.
(Sweet Potato Tec)

 
This was selected as the best answer
Maharajan CMaharajan C
Hi Supriyo,

Let me know isthat helpful to you or not because am spended some hours to do that...


Thanks,
Raj.
(Sweet Potato Tec)