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
-~----------~----~----~----~------~----~------~--~---
