CODEWITHSUNDEEP
jqueryjquery-uidatepicker
trung
trung

Reputation: 11

jQuery ui datepicker conflicts with custom event?

This code creates a custom show & hide event. It's from here.

// show & hide events
$.each(["show", "hide", "toggleClass", "addClass", "removeClass"], function() {
    var oldFn = $.fn[this];
    $.fn[this] = function() {
        var hidden = this.find(":hidden").add(this.filter(":hidden"));
        var visible = this.find(":visible").add(this.filter(":visible"));
        var result = oldFn.apply(this, arguments);
        hidden.filter(":visible").each(function() {
            $(this).triggerHandler("show");
        });
        visible.filter(":hidden").each(function() {
            $(this).triggerHandler("hide");
        });
    };
});

It works well until I use datepicker in jQuery UI. $("input[type=text]").datepicker(). I got this error

jquery-ui.js:7473Uncaught TypeError: Cannot call method 'keydown' of undefined

But if I comment out "addClass" & "removeClass" like this

$.each(["show", "hide", "toggleClass"/*, "addClass", "removeClass"*/], function() {

It works again. Here's the test http://jsfiddle.net/Lf9Hv/2/

Anybody has any idea?

Thanks.

Upvotes: 1

Views: 987

Answers (1)

Ben Barden
Ben Barden

Reputation: 2111

Well, datepicker does a fair amount of class manipulation while setting the datepickers up, and you probably don't want to muck with it while it does. Perhaps run datepicker first, and then set up your event listener once it's done?

edit: and on second glance, I can definitely see at least one thing that you're doing that's wrong. You need to add quotes around the "text"

$("input[type='text']").datepicker()

Using the two different kinds of quotes will let you nest them like that. (Nesting them the other way also works.) Again, I can't tell you if this will solve all your problems, but it sure couldn't hurt.

Upvotes: 1

Related Questions