[SalesForce] Display Records Dynamically based on Date Filters

Using two date filters displayed in the VF page I would like to render the records in apex:pageblocktable.

I am pretty new to Visualforce and this is what I have built so far.

VF Page

<apex:page standardController="Expense__c" extensions="expense_extension" recordSetVar="expenses" sidebar="false" >
<apex:form >
 <apex:pageBlock >
 <b> {!Greeting} </b>
 <apex:pagemessages />
 <apex:pageblockButtons >
   <apex:commandButton action="{!save}" value="Save"/>
 </apex:pageblockButtons>

 <apex:pageBlockTable var="e" value="{!expenses}">
  <apex:column headerValue="Expense Amount">
   <apex:inputField value="{!e.Amount__c}"/>
  </apex:column>
  <apex:column headerValue="Date">
   <apex:inputField value="{!e.Expense_Date__c}"/>
  </apex:column>
  <apex:column headerValue="Expense Type">
   <apex:inputField value="{!e.Type__c}"/>
  </apex:column>

  <apex:column headervalue="Expense Sub Type">
   <apex:inputField value="{!e.Sub_Type__c}"/>
  </apex:column>

  <apex:column headervalue="Comments">
   <apex:inputField value="{!e.Comments__c}"/>
  </apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
</apex:page>

Controller Extension

public class expense_extension {

private final Expense__c e;
public ApexPages.StandardSetController sc;

public expense_extension(ApexPages.StandardSetController exp)
{
this.sc = exp;
}

public String getGreeting()
{  
return 'Hello ';
}

public PageReference save()
{   
sc.save();
PageReference p = new PageReference('/apex/ExpenseList');
return p; 
}    
}

I have been able to display all the records so far.

enter image description here

The next step I believe is to display the date controls and based upon the selection display the records.

Can someone tell me how I can display date controls ("Start" & "End") ?.

Also I am interested to know how we can display date controls in VF without them being bound to any object columns.

Best Answer

To use the standard SFDC datepicker control, you need to add two fields of type Date to any SObject (for example, your Expense__c object, but could be an arbitrary object Foo__c

Name one field start_date_filter__c, type = date, the other end_date_filter__c

Then bind the VF page inputFields to the object containing these fields in your controller that is instantiated in your constructor. This object is NOT one of the objects fetched by the standard setController.getRecords().

In effect, you are just leveraging SFDC default VF control construction at the cost of burning up a couple of sobject fields that need never be displayed on a detail page

There are other solutions using custom datepickers via jQuery and the like but the above is easy and requires no new technology to learn