jQuery UI DatePicker, IE 7 and an extra comma

Well, looking at the post title doesn't give you an idea about what the post is all about but that's best possible title I could think and come up with. "jQuery UI DatePicker, IE 7 and an extra comma" combination can give you some pain. Why? Let's see through a piece of code.


Below jQuery code attaches jQuery UI Datepicker widget to an input element "txtDate" and some options are also set.
$(document).ready(function() {
    $('#txtDate').datepicker({
        showAnim: 'slide',
        dateFormat: 'dd-mm-yy',
    });
});​
If you are currently reading this post in IE 7 or lower version, then you will notice that this demo is not working. But if you see the below demo in other browsers (Chrome, firefox or even IE8) the demo seems to working like charm.

Copy the link "http://jsfiddle.net/jquerybyexample/JkTra/embedded/result" and check this demo in other browsers.

See result below


Oh!!! Even I was scratching my head for few minutes. So why it is not working in IE7? If you had seen the jQuery code clearly then you must have notice that there is an extra comma just after "dateFormat: 'dd-mm-yy'" option. This extra comma is culprit. Just remove the comma and code will work fine in IE7 as well.
$(document).ready(function() {
    $('#txtDate').datepicker({
        showAnim: 'slide',
        dateFormat: 'dd-mm-yy'
    });
});​
I don't know the reason why this is happening but this is weird and weird things can happen with IE browsers. I am not sure who is culprit. The extra comma or "IE7"? Decide yourself.. :)
See Complete Code
Feel free to contact me for any help related to jQuery, I will gladly help you.
SHARE

Nothing shocks me, I'm a Software Engineer. And I am not young enough to know everything. I live in World Wide Web and from there take care of this website. This website communicates about my work, learning and experience. I believe life is short, and it is for loving, sharing, learning and connecting. So lets connect..