Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery datepicker having trouble in IE8?

i did see a couple of similar threads, but later they turned out to be different issues...mine seems a browser specific problem surely because my datepicker works fine in Firefox, but certainly not in IE8. Here is my original problem and the source code

I updated my datepicker to jQuery UI Datepicker 1.8.11...still it just doesn't work in IE 8! The date-picker pops up just fine, but no event fires from it. I mean no click...nothing happens...

Any ideas?

like image 936
hillary Avatar asked Mar 28 '11 03:03

hillary


2 Answers

Hey I don't know if you have solved that problem yet, however the problem is with any added attributes. Especially if you are using:

yearRange: '-100:+10'

for example ...

This is how you resolve the issue: copied from http://satish.name/?p=19

jQuery datepicker adds a new attribute to the DOM element in IE. if you try to add a new DOM element dynamically copying from an existing element the datepicker will not work in IE as the newly added DOM element refers to the old jQuery attribute. One way to fix this is to delete the attribute and then instantiate the datepicker class on the element. See the following code for the fix.

//newDiv is the new added dom element with innerHTML
jQuery("#newDiv").find(".datePicker").each(function() {
    //removing jquery added attribute as this is causing the dynamically
    // added DOM elem referring old DOM element from it is copied.
    if (jQuery.browser.msie) {
        var jqaddedattr;
        jQuery(this.attributes).each(function() {
            if (this.name.search(/jQuery/) != -1) {
                jqaddedattr = this;
            }
        });
        if (jqaddedattr) {
            jQuery(this).removeAttr(jqaddedattr.name);
        }
    }
    jQuery(this).datepicker({yearRange: '-100:+10', changeFirstDay:false}).val("").trigger('change');
})

cheers

like image 133
mahatmanich Avatar answered Oct 26 '22 15:10

mahatmanich


This jsFiddle contains the most basic code to get a jQuery UI datepicker working on an <input type="text" /> element.

http://jsfiddle.net/rbwh7/2/

I've confirmed that this runs on IE8, Chrome, Firefox.

Can you test this as see if this works for you?

like image 23
Alastair Pitts Avatar answered Oct 26 '22 14:10

Alastair Pitts