I created a ticket for this: http://dev.jqueryui.com/ticket/4481
Dave On Apr 17, 9:27 am, Fontzter <[email protected]> wrote: > I think this is a bug. It seems that the beforeShowDay function > breaks if the dialog element is not an input (i.e. inline). If you > comment out the beforeShowDay the code in the jsbin works. Likewise, > if you use an input instead the beforeShowDay works. Can you enter a > ticket for this? > > It seems that the inline picker is not fully rendered. A work-around > is below using a brief timeout to let the dp render. You may have to > lengthen the duration. This is not optimal; but it is a work-around. > I also resaved it in the jsbin:http://jsbin.com/owita > > Dave > > $(function() { > $("#datepickerthing").datepicker({ > altField: '#actualDate', > minDate:'0', > maxDate: '+2M' > }); > //beforeShowDay must be delayed when the datepicker element is > rendering inline > setTimeout(function() {$("#datepickerthing").datepicker("option", > "beforeShowDay", nationalDays); }, 100); > > var natDays = > ["4/22/2009","4/23/2009","4/24/2009","4/25/2009","4/26/2009","5/27/2009","5/28/2009","6/26/2009","6/27/2009","6/28/2009","6/29/2009","6/30/2009"]; > function nationalDays(date) { > var sDate = (date.getMonth()+1).toString() + "/" + date.getDate > ().toString() + "/" + date.getFullYear().toString(); > if ($.inArray(sDate, natDays) != -1) return [false,"","Not this > day!"]; > else return [true, ""]; > } > > }); > > On Apr 16, 7:17 pm, GulDam <[email protected]> wrote: > > > Now this is a thing of beauty. It works. I'm most grateful!!! > > > Now, if I try to use the datepicker inline, then I run into issues > > again. > > > <body> > > <input id="actualDate" type="text" /> > > <div id="datepickerthing"></div> > > </body> > > > I get the error that H is notdefined. Tried this in JS Bin as well as > > locally. Same issue. > > > Back to scratching my head. > > > On Apr 16, 1:46 pm, Fontzter <[email protected]> wrote: > > > > Try this code:http://jsbin.com/imike/edit > > > > $(function() { > > > $("#datepickerthing").datepicker({ > > > altField: '#actualDate', > > > minDate:'0', > > > maxDate: '+2M', > > > beforeShowDay: nationalDays > > > }); > > > > var natDays = > > > ["4/22/2009","4/23/2009","4/24/2009","4/25/2009","4/26/2009","5/27/2009","5/28/2009","6/26/2009","6/27/2009","6/28/2009","6/29/2009","6/30/2009"]; > > > function nationalDays(date) { > > > var sDate = (date.getMonth()+1).toString() + "/" + date.getDate > > > ().toString() + "/" + date.getFullYear().toString(); > > > if ($.inArray(sDate, natDays) != -1) return [false,"","Not this > > > day!"]; > > > else return [true, ""]; > > > } > > > > }); > > > > Hth, > > > > Dave > > > > On Apr 16, 3:09 pm, GulDam <[email protected]> wrote: > > > > > I'm (still) struggling with the DatePicker. > > > > > Here's the DatePicker in question: > > > > >http://www.fishyfish.com/datepicker/index.html > > > > > I am trying to add custom dates. Poking around I've found an example > > > > that someone else was struggling with, and borrowed some ideas. > > > > > The DatePicker functions. And dates in the past are disabled, as are > > > > dates two months in the future. This is as desired. > > > > > And so in this example, I've tried adding a class: brownbox to change > > > > the background color and border of the dates I have added to natDays. > > > > There is no change in styles but there are also no errors being > > > > thrown. > > > > > Any ideas why my code isn't working? > > > > > Thanks. > > > > > Steveoh > > > > > Here's the code: > > > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" > > > > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> > > > > <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en"> > > > > <head> > > > > <meta http-equiv="content-type" content="text/html; charset=utf-8" /> > > > > <title>My Lovely Calendar</title> > > > > <link type="text/css" href="css/irp.css" rel="stylesheet" /> > > > > <link type="text/css" href="jquery-ui-1.7.1.custom/css/smoothness/ > > > > jquery-ui-1.7.1.custom.css" rel="stylesheet" /> > > > > <script type="text/javascript" src="jquery-ui-1.7.1.custom/js/ > > > > jquery-1.3.2.min.js"></script> > > > > <script type="text/javascript" src="jquery-ui-1.7.1.custom/js/jquery- > > > > ui-1.7.1.custom.min.js"></script> > > > > > <script type="text/javascript"> > > > > $(function() { > > > > $("#datepickerthing").datepicker({ altField: > > > > '#actualDate', minDate: > > > > '0', maxDate: '+2M' }); > > > > $("#datepickerthing").datepicker({ beforeShowDay: > > > > nationalDays}); > > > > > natDays = [[4, 22, 2009],[4, 23, 2009],[4, 24, 2009],[4, 25, > > > > 2009], > > > > [4, 26, 2009],[5, 27, 2009],[5, 28, 2009],[6, 26, 2009],[6, > > > > 27, > > > > 2009], > > > > [6, 28, 2009],[6, 29, 2009],[6, 30, 2009]]; > > > > > function nationalDays(date) { > > > > for (i = 0; i < natDays.length; i++) { > > > > if (date.getMonth() == natDays[i][0] - 1 > > > > && date.getDate() == natDays[i][1] > > > > && date.getFullYear() == natDays[i][2]) > > > > { > > > > return [false, natDays[i][0][1] ]; > > > > } > > > > } > > > > return [true, 'brownbox']; > > > > } > > > > }); > > > > </script> > > > > > </head> > > > > <body id="OT_irp"> > > > > <div class="OT_wrapper"> > > > > <ul> > > > > <li><label>Select Date:</label> > > > > <div id="datepickerthing"></div> > > > > <input type="text" id="actualDate" value=""> > > > > </li> > > > > </body> > > > > </html> > > > > > On Apr 14, 2009, at 12:12 PM, JBeckton wrote: > > > > > I have not tried to use this date picker to it's limits but what I > > > > suggest if you need a date picker with allot more options use the one > > > > from YUI. It may have a bit of a learning curve but it does everything > > > > you need. --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
