Salesforce Certificate

Friday, 17 January 2014

Add years in salesforce standard & custom date field on Visualforce Page

In salesforce calender widget we can't able to select previous years from UI. but sometimes in business it's very important to select that.

Add below Javascript code in your visualforce page to add years in salesforce standard & custom date field

Javascript:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<span id="hideThisHomePageComp"></span>
  <script type="text/javascript">
  $j = jQuery.noConflict();
   $j(document).ready(function() {                   var startYear=1900;                   var endYear=2024;                   var htmlStr='';                  if(startYear<endYear){
                                 for(i=startYear;i<endYear+1;i++){
                                                 htmlStr += "<option value=\""+i+"\">"+i+"</option>";
                                 }
                                 $j('#calYearPicker').html(htmlStr);
                  }
   $j('#sidebarDiv #hideThisHomePageComp').parent().parent().hide();
                  }  );
  </script>
 so your visualforce Page will be look like this.

Visualforce Page:
<apex:page standardController="Contact" id="mypage">
  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<span id="hideThisHomePageComp"></span>
  <script type="text/javascript">
  $j = jQuery.noConflict();
   $j(document).ready(function() {                   var startYear=1900;                   var endYear=2024;                   var htmlStr='';                  if(startYear<endYear){
                                 for(i=startYear;i<endYear+1;i++){
                                                 htmlStr += "<option value=\""+i+"\">"+i+"</option>";
                                 }
                                 $j('#calYearPicker').html(htmlStr);
                  }
   $j('#sidebarDiv #hideThisHomePageComp').parent().parent().hide();
                  }  );
  </script>

    <apex:form >  
        Date: <apex:inputField value="{!contact.birthdate}" id="demo" onfocus="DatePicker.pickDate(false, this , false);"/>  
    </apex:form>
</apex:page>


No comments:

Post a Comment