Standard Datepicker Year values

It’s a lot of tweaking to get this injected into standard pages… worst case, just type the year in 😛 reinventing vs decorating the native picker is an interesting debate, all of us with unique circumstances!

1. Setup > Customize > User Interface

2. Check [X] Show Custom Sidebar Components on All Pages

3. Create a new Home Page Component (HTML, narrow) called “Date Picker Years” containing:

   <script>
     (function() {
       var windowOnload = window.onload;
       window.onload = function() {
         if (windowOnload) windowOnload();
         var select = document.getElementById('calYearPicker');
         if (!select) return;
   
         select.innerHTML = '';
         var startYear = new Date().getFullYear() - 90;
         for (var year = startYear; year < startYear + 100; year++) {
           select.options[select.options.length] = new Option(year, year);
         }
       }
     }());
   </script>
   

4. Place that Component on your Home Page Layout.

   

Edit – was asked for some explanation:

• the wrapper (function() { ... }()); prevents vars polluting the global scope
• don’t just trample the window.onload function, store it and call it (interceptor pattern)
• calYearPicker could disappear any time; if so, “get out of dodge quick” by returning early