How to use custom date fields in Visualforce Page?

Question

I am new to Salesforce development. Could you please help me on Visualforce page design? I have requirement to create Account object activity Visualforce page. As soon as user open this Visualforce page it has two input fields that User able to enter start date/time, end date/time and click submit button, Visualforce page displays the account records those were created during that time period. These start date/time and end date/time are not account's fields, Visualforce page use them to catch the (start, end) date/time values enter by users and pass them to SOQL query present in controller. Please guide me which tag should I use either inputField or inoutText to display start and end date/time fields in Visualforce page?

Answer 1

This might be useful for you.

VF Page

<apex:page controller="accountSearcher" docType="html-5.0">
<center><h1>Account Search Page</h1></center>
<apex:form>
   Start Date: <apex:input type="date" value="{!startDate}" required="true" />
   End Date: <apex:input type="date" value="{!endDate}" required="true" />
   <apex:commandButton action="{!searchAccount}" value="Search" reRender="dataWrapperPanel" lang="End Date"/>

   <apex:outputPanel id="dataWrapperPanel">
      <apex:pageBlock title="Account List" id="dataBlock" rendered="{! showResult }">
          <apex:pageBlockSection >
              <apex:pageBlockTable value="{!accList}" var="acc" >
                  <apex:column value="{!acc.Name}"/>
              </apex:pageBlockTable>
          </apex:pageBlockSection> 
      </apex:pageBlock>
      <apex:outputLabel id="noRecFound" rendered="{! blnNoResultFound }">No Record Found !!!</apex:outputLabel>
   </apex:outputPanel>
 </apex:form>
 </apex:page>

Controller

public class accountSearcher{

public static Date startDate{get;set;}
public static Date endDate{get;set;}
public static List<Account> accList{get;set;}
public boolean showResult{get;set;}
public boolean blnNoResultFound{get;set;}

public accountSearcher(){
    showResult = false;
    blnNoResultFound = false;
    accList = new List<Account>();
}
public PageReference searchAccount(){
    if(startDate != NULL && endDate != NULL){
        accList = [SELECT Id,Name FROM Account WHERE createdDate >= : startDate AND createdDate <: endDate];
    } 
    if(accList.size() > 0){
         showResult = true;
         blnNoResultFound = false;
    }
    else{
         blnNoResultFound = true;
         showResult = false;
    }
    return null;        
      }
   }

Answer 2

In the apex code declare Date type variable like this public Date arrivalDate {get;set;}

and assign value in arrival date field in apex code

In the VF page, bind this variable in apex:outputField value="{!arrivalDate}">