close() function not work on IE

[fabianoroberto]

Hi everyone

i found a litle bug in pickadate...
on select a date the close event seems not triggered (also in demo page http://amsul.github.com/pickadate.js/docs.htm).
To fix this problem i change in pickadate.legacy.js version the line 66:

- 'focus click': function() {
+ click: function() {

and now seems work.
You could check if it's the right solution?

Regards, Fabiano

[jagooding]

Same issue here, it was working just fine in IE a couple days ago, and today I noticed the calendar is not where it should be, and does not close once you select a date.

I thought maybe it was a conflict I caused with my code, however this is not the case because the error is reproducible at this address: http://amsul.github.com/pickadate.js/docs.htm and is reproduceible with the default example with the code here : https://github.com/amsul/pickadate.js/archive/gh-pages.zip

The code provided above did not work for me, all it did was completely disable the calendar, with the input behaving like a standard text input. I haven't been able to figure out what is causing this.

I've added a screen shot of the bug.

[amsul]

These are known bugs in IE I've been tackling the last couple days. I was able to fix the styling issue easily (on dev branch). However the close issue is a bit trickier to solve.

The calendar needs to open up when the user "focuses" or "clicks" on the input field. So removing the focus binding would be quite troublesome.

What actually is happening is when a date is clicked, focus needs to be returned to the input field. However IE waits for the next event tick - which means the calendar is already "closed". And this causes it to reopen with the illusion that it never closed.

I think I've figured out how to fix this. I'll dabble around with it now.

[jagooding]

Thanks for the info and explanation. Now that I have an idea of what's going on I'll take a look as well.

[jagooding]

So I've confirmed that remove the focus binding fixes the problem, but as you stated, that creates the obvious problem of the calendar doesn't launch if you say tab into it to achieve focus. I tried the following:

click : function() {
    $HOLDER.addClass( CLASSES.focused )
    P.open()
},
focus : function() {
    $HOLDER.addClass( CLASSES.focused )
    P.open()
},

I thought maybe it might be caused by the way jquery is interpreting having click and focus together in IE. Not the case.

Then I thought I could manually trigger the click event ( I also tried the commented out stuff)

click : function() {
    $HOLDER.addClass( CLASSES.focused )
    P.open()
},
focus : function(e) {
    $ELEMENT.trigger( 'click');
    //e.preventDefault;
    //e.stopPropagation();
    //return FALSE;
},

None of that worked either. I've started looking into it more deeply. Then a thought came across my mind. Not sure if you a familiar with the simplemodal project, but if you add a jquery ui element to it, data doesn't persist across openings of the modals unless you save it's state in a way, and so all the events attached to an object basically get purged. I'm wondering if that is something even remotely similar here?

[jagooding]

@amsul Thing of interesting note, if you click something while the calendar is open, and hold down, and do not release your mouse it closes just fine, and if you release your mouse once the calendar is closed, it stays closed.

The calendar only reopens if you "mouseup" before the close animation is complete.

[amsul]

@jagooding Yes, IE is has some whacky event handling/queuing going on there. If I understand this (http://msdn.microsoft.com/en-us/library/ms533023(v=vs.85).aspx#The_Life_Cycle_of_an) correctly, it seems to say that the browser waits for the previous event (meaning the click) to complete it's cycle before moving on to the next event (meaning the focus) - even if it's triggered within the previous event cycle.

So I resorted to creating a boolean that keeps track of the calendar state for IE. With the commit just pushed onto the dev branch, everything seems to be working fine in IE7+.

[fabianoroberto]

Today I downloaded last changes in dev branch. If I use pickadate.js in IE 8 the page is locked. I try to switch to legacy version but appear same problem of close()

[amsul]

Yes, I've been playing around with it all day. Anything I changed for IE seemed to cause issues in other places. Although I hate user-agent specific fixes, for now the commit I just pushed seems like the best solution without a rewrite of a significant chunk.