Question on date fields in visualforce page

Question

When I use a date field in a VF page and try to do validation and return a validation error - such as, if date can't be greater than today's date, the date format automatically changes to something like,

Jul 20 2015 00:00:00

and when I try to submit that again, I get an error that states that values can't be converted from text to date. Even when I try to do any formatting within the controller and assign it back to the date field as mm/dd/yyyy, it still only shows in the above format.

Does anyone know how to keep the date format as mm/dd/yyyy or whatever format is acceptable when the post back occurs and I do not get this error.

Right now, I'm using a apex:input "text field" and using the date.parse function to convert it into a date before assigning to the sobject's field before I save it to the database.

Is this the correct way of doing it? or is there an easier workaround?

<apex:page controller="contExtBkup" docType="html-5.0">
<apex:pageMessages />
<apex:includeScript value="{!URLFOR($Resource.D2DCalendar, '/calendar.js')}" />
 <apex:stylesheet value="{!URLFOR($Resource.D2DCalendar, '/calendar.css')}"/>


<apex:form >
<apex:pageblock >
    <apex:pageBlockSection >
                     <apex:pageBlockSectionItem >
                     <apex:outputLabel value="{!$ObjectType.contact.fields.birthdate.label}"  />
                      <apex:outputPanel styleClass="requiredInput" layout="block">
                      <apex:outputPanel layout="block" styleClass="requiredBlock" />
                            <apex:inputtext id="birthdate"   
                                            rendered="{!NOT(dobOp)}"
                                            value="{!contact.birthdate}"
                                            onfocus="initialiseCalendar(this,'{!$Component.birthdate}')"/>

                        <apex:outputPanel rendered="{!dobOp}">
                                <apex:inputtext id="birthdate1" styleClass="error"  

                                            value="{!contact.birthdate}"
                                            onfocus="initialiseCalendar(this,'{!$Component.birthdate1}')"/>

                                <div class="errorMsg"><strong>Error:</strong>&nbsp;{!dob_error}</div>

                            </apex:outputPanel>
                         </apex:outputPanel>
                  </apex:pageBlockSectionItem>  
                   </apex:pageBlockSection>

<apex:pageBlockButtons >
    <apex:commandButton value="Next" action="{!next}"  />
</apex:pageBlockButtons>     

 </apex:pageblock>    


 </apex:form>

Note I'm including an inline Javascript calendar here

Controller:

 //SPN
 public with sharing class contExtBkup {
 public boolean dobOp{get;set;}
 public string dob_Error{get;set;}
 public Contact contact{get;set;}


 public contExtBkup() {
        dobOp=false;   
        if(this.contact == null)
            this.contact = new Contact();
}

public pageReference next(){

    if (contact.birthdate == null){
        dobOp=true;
        dob_Error = 'Please enter date';

    }
     else if (contact.birthdate >= date.today()){
            dobOp=true;
            dob_Error='DOB cant be current/future date';
                       /*string date1 = contact.Birthdate.format();
            contact.Birthdate = date.parse(date1);
            contact.Birthdate = date.parse('07/31/2015'); */
    }                
     else{
           dobOp=false;
           dob_Error='';
         }  
  return page.datePickerJS;
}

}

I have added the error message too...How to change this format to something like MM/DD/YYYY so that I don't get the error message about converting text to date.

Answer 1

If you change your inputtext to inputField, then it will work. In this case you would not need the onfocus="initialiseCalendar(...)"

<apex:inputField id="birthdate"   
                      rendered="{!NOT(dobOp)}"
                      value="{!contact.birthdate}"/>

Otherwise, if you want to use a custom date picker, then change your inputtext to input and add type="date"

<apex:input id="birthdate"
                   type="date"
                   rendered="{!NOT(dobOp)}"
                   value="{!contact.birthdate}"
                   onfocus="initialiseCalendar(this,'{!$Component.birthdate}')"/>

Answer 2

Use Date class of Apex. That will help.

You can use it like this:-

Controller

public class ControllerForDate {
    public Time useDate {get; set;}
    public ControllerForDate()
    {
        if (useDate == null) {
           useDate =  DateTime.now().date();
    }
}

In Page, use this:-

<apex:input type="date" value="{!useDate}"/>