0

On http://www.scottsdalecvb.com, I'm using jQuery UI's .datepicker() on a number of date text fields. Strangely today I noticed that the date fields in the Travel Tools box (right side of the page with the powered by Travelocity logo), stopped functioning correctly in IE8. They will open the calendar on focus and will allow you to click a date to fill in the box, however, the prev and next buttons don't scroll the calendar. No error is displayed in IE and they work fine in Firefox and Chrome.

I do use several date fields. In fact, if you click on events in the top bar, the drop down exposed two other text boxes which use datepicker() and are working correctly.

The code that is initializing the date fields is in /includes/scripts/widget.wct.js and reads:

    var dateBoxes = $("input[class*=Date]", "#travelocity");
    var opt = { minDate: new Date().setDate(dateDepart.getDate() + 1), maxDate: new Date().setDate(dateDepart.getDate() + 329), showOn: "both", buttonImageOnly: true, buttonText: "Choose date", buttonImage: "/includes/images/wct/calendar.gif"};  
      dateBoxes.each(function() {
       $(this).datepicker(opt)
      });

Any help would be appreciated.

Josh
  • 23
  • 1
  • 8
  • I found the answer in case anyone else has this same issue. At least part of the answer. The minDate and MaxDate were making the plugin set the _canAdjustMonth value be false (I think appropriately), disabling the prev and next. Why this was only happening in IE, I'm not sure. However, removing those two options fixed it. – Josh Jan 28 '11 at 03:25

5 Answers5

6

I don't know if it can still help but this is what I found : On IE the "prevText" parameter must not start by the caracter '<' followed by text. Here are some exemples I tried :

  • prevText: '<-Préc' -> OK
  • prevText: '< Préc' -> OK
  • prevText: '<Préc' -> NOT OK

I suppose IE assumes it like part of a tag <..../>

Hémistiche
  • 61
  • 1
  • 1
  • It worked for me. It just happened to the project we were working on and saw that, IE8, instead of a span, it added the previous text before the span, just like "". Thanks for it! – Zander Sep 09 '15 at 15:45
3

My problem was that I fed the date picker with invalid minDate / maxDate values. I thought I was passing date objects but in IE, date object won't accept a date string in format yyyy-mm-dd. So my minDate / maxDate values were not date objects but in fact NaN.

In other words, new Date('2010-01-01') = NaN. You need to split it to year, month and day and then init the date object as new Date(year, month-1, day). For example:

var dateArray = new String('2010-01-01').split('-');
var dateObject = new Date(dateArray[0], dateArray[1]-1, dateArray[2]);

Thank you guys for pointing me to the right direction. Funny that the side effect was disappearing prev/nav month buttons.

Petr 'PePa' Pavel
  • 520
  • 3
  • 10
2

I had the same problem of 'prev' and 'next' not working in IE8. Newer versions and browsers worked fine. I have custom datepicker css (not like the sample jquery-ui css).
Adding 

width: 60%;
margin: auto;

to the 

.ui-datepicker-title

class solved the problem.

guldner
  • 33
  • 4
0

I also had the issue of the next and previous months buttons not working. When I added in the sample CSS from the jQuery UI site, it worked again. 

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
Soshmo
  • 318
  • 2
  • 7
0

//For IE8 , if you initial datepicker (like minDate) with new Date() value, add this check before using it directly.

var mDate = new Date($("#TargetDate").val());
if(isNaN(mDate)) {
      mDate = new Date($("#TargetDate").val().replace(/-/g, '/'));
}

Ref : Javascript JSON Date parse in IE7/IE8 returns NaN

Community
  • 1
  • 1
Chieh
  • 128
  • 1
  • 2