Jquery UI Calendar Control DatePicker limit date (GO)

Find this post online: http://www.jssay.com/blog/index.php/2010/04/27/%E5%A6%82%E4%BD%95%E7%A6%81%E7%94%A8datepicker%E7%9A% 84%e6%97%a5%e6%9c%9f/

1 jquery is now widely used, on the one hand, its powerful library, on the other hand it is rich in plugins. The recent use of the jquery DatePicker plugin, it feels great, the interface is beautiful, full-featured, and extensibility is very good. It is highly recommended. 2 3 there is a requirement in the project to disable certain dates, such as weekends and holidays. Read the source of the DatePicker, found that there is a noweekends method can be very simple to implement the disabled weekend, see the code:4 5$("#datepicker"). DatePicker ({6 beforeshowday: $.datepicker.noweekends7 });8 9 If you want to disable some specific dates, you can define a function implementation, as follows:Ten  OneNatdays = [ A[7, at， the], [7, -， the], [8, -, the], [8, -, the], - ]; -  the function Nationaldays (date) { -  for(i =0; i < natdays.length; i++) { - if(date.getfullyear () = = natdays[i][2] && date.getmonth () = = natdays[i][0] -1 -&& date.getdate () = = natdays[i][1]) { + return[false, natdays[i][2] +'_day']; - } + } A return[true,"']; at } -  -$("#datepicker"). DatePicker ({ - beforeshowday:nationaldays - }); -  in The return value of the above function is in the array, the first Boolean value indicates whether the date is disabled, true is disabled, and false is disable. The second parameter is a style name that can be customized when it is disabled.  -  to If you only require a date that is selectable for a certain period of time, you can do this by setting two parameters: +  -$("#datepicker"). DatePicker ({ theMinDate:NewDate ( the,6,6), *MaxDate:NewDate ( the,7, -), $ });Panax Notoginseng  -The above settings indicate that they are optional from May 6, 2009 to June 14, 2009.

Now consider my own application, I now want to do the short-season price list, if you choose High Season, the date can not choose the date of non-peak season, the season is the same as the peace season.

At first glance, it may be necessary to define a date range, but when you look at the source code upstairs, you only need to limit the month. Because the beginning and end of each light season is the end of the natural month of 1th and 30th (31, 28th), so the array there is only a value, and do not need three values to determine. For general applications, a maximum of two is required, that is, the date and the month, and the year is almost the same year.

Another workaround, the start date selection. If the peak season starts in July and the current date is May, then the start date for the calendar should be July 1. If the current date is in peak season, start with the day as the starting point for the date.

Thirdly, I have to get the current seasonal characteristics from a hidden element, the low season, the flat season or the high season, different seasons have different prices. So because each browser has different timing for the browser to load elements, it is decided to put the $ (function () {}) in jquery;

So there is the following JS

1 varD=NewDate ();2 vary=d.getfullyear ();3 varM=d.getmonth () +1;4 varday=d.getdate ();5 6 7 function Nationaldays (date) {8      for(i =0; i < natdays.length; i++) {9         if(Date.getmonth () = = natdays[i][0] -1) {Ten             return[false, natdays[i][0] +'_day']; One         } A     } -     return[true,"']; - } the  - $ (function () { -     varSeason=document.getelementbyid ('season'). Value; -     if(season=='Busy'){ +document.getElementById ('seasontips'). innerhtml='Peak Season Month selection can only be April May September October November' -         if(m>1&& m<4){ +mindate=y+'-4-1'; A}Else if(m>5&&m<9){ atmindate=y+'-9-1'; -}Else if(m> One){ -mindate=y+1+'-4-1'; -}Else{ -mindate=y+'-'+m+'-'+Day ; -         } in         //Peak Season 4,5,9,10,11 -natdays=[[1],[2],[3],[6], [7], [8],[ A],]; to}Else if(season=='Common'){ +document.getElementById ('seasontips'). innerhtml='the month of the flat season can only be March June July August'; -         if(m<3){ themindate=y+'-3-1'; *}Else if(m>3&& m<6){ $mindate=y+'-6-1';Panax Notoginseng}Else if(m>8){ -mindate=y+1+'-3-1' the}Else{ +mindate=y+'-'+m+'-'+Day ; A         } the         //Ping 3678 +natdays=[[1],[2],[4],[5],[9],[Ten],[ One],[ A],]; -}Else if(season=='Dull'){ $document.getElementById ('seasontips'). innerhtml='the month of the low season can only be January February and December'; $         if(m>2&& m< A){ -mindate=y+'-12-1'; -}Else{ themindate=y+'-'+m+'-'+Day ; -         }Wuyi         //off-season 12.1.2, disable 345678910 thenatdays=[[3],[4],[5],[6],[7],[8],[9],[Ten],[ One],]; -     } Wu     //Datepicker -$('. Wdate'). DatePicker ({ AboutNumberofmonths:2, $Showbuttonpanel:false, -DateFormat:'YY-MM-DD', - Mindate:mindate, - Beforeshowday:nationaldays, A         }); +});

Jquery UI Calendar Control DatePicker limit date (GO)