{"id":3106,"date":"2012-09-20T18:22:49","date_gmt":"2012-09-20T12:52:49","guid":{"rendered":"http:\/\/JitendraZaa.com\/blog\/?p=3106"},"modified":"2015-06-23T16:15:12","modified_gmt":"2015-06-23T16:15:12","slug":"change-year-range-in-datepicker-salesforce","status":"publish","type":"post","link":"https:\/\/www.jitendrazaa.com\/blog\/salesforce\/change-year-range-in-datepicker-salesforce\/","title":{"rendered":"Change year range in Datepicker – Salesforce"},"content":{"rendered":"

In Datepicker control of salesforce, most of the developers must have faced issue on year range for Datepicker control. We cannot configure the year range in standard date picker control. However, for a long time i am using a JQuery code to change the range of years in Datepicker and thought to share with you. You can find similar solution at many places but thought to add in my articles library also.<\/p>\n

\"Year<\/a>
Year Range in Salesforce Date Picker<\/figcaption><\/figure>\n

So, lets start to resolve this problem. The only thing we will need is Javascript based Home page Component.
\nNavigate to “Set up | App SetUp | Customize | Home | Home Page Components”<\/strong>.
\nclick on “New” Custom Component. In Next screen you will prompted with the type of Homepage component.<\/p>\n

\"Homepage<\/a>
Homepage Component Type in Salesforce<\/figcaption><\/figure>\n

Select “HTML Area”.
\nIn Next screen, click on checkbox “Show HTML” as shown in below image.<\/p>\n

\"Javascript<\/a>
Javascript code in Home Page component – Salesforce<\/figcaption><\/figure>\n

Now write below Javascript code in HTML area :<\/p>\n

\r\n<script type="text\/javascript" src="\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.8.0\/jquery.min.js"><\/script>\r\n<span id="hideThisHomePageComp"><\/span>\r\n<script type="text\/javascript">\r\n$j = jQuery.noConflict();\r\n$j(document).ready(function() {\r\n                var startYear=1985;\r\n                var endYear=2024;\r\n                var htmlStr='';\r\n                if(startYear<endYear){\r\n                                for(i=startYear;i<endYear+1;i++){\r\n                                                htmlStr += "<option value=""+i+"">"+i+"<\/option>";\r\n                                }\r\n                                $j('#calYearPicker').html(htmlStr);\r\n                }\r\n                $j('#sidebarDiv #hideThisHomePageComp').parent().parent().hide();\r\n                }\r\n);\r\n<\/script>\r\n<\/pre>\n
Note:<\/strong><\/span><\/p>\n