CODEWITHSUNDEEP
javascriptjqueryinternet-explorer
Omu
Omu

Reputation: 71218

trying to make IE trigger change on Enter key in textbox

in Chrome and FF when hitting enter in textbox will trigger change, not in IE, so I'm trying to make it do the same

this is what I have for the moment: http://jsfiddle.net/nV4SA/8/

//fix for IE to trigger change on enter
    $("input[type=text]")
        .on("change", function(e) {
            $.data(this, "value", this.value);
        }).on("keyup", function(e) {
            if (e.which === 13 && this.value != $.data(this, "value")) {
                $(this).change();
            }
        });

the only drawback with this code is that in IE users hits enter the change happens, but the change will happen again when textbox loses focus

Upvotes: 2

Views: 2330

Answers (1)

charlietfl
charlietfl

Reputation: 171669

Instead of triggering change it seems to work if you trigger blur in IE only. Use $.support to test for IE.

/* false in IE.. see jQuery APU */
var changeBubble=$.support.changeBubbles;

$("input[type=text]").on("change", function(e) {
    $.data(this, "value", this.value);
}).on("keyup", function(e) {
    if (e.which === 13 && this.value != $.data(this, "value") && !changeBubble) {
        e.preventDefault();
        $(this).trigger('blur');
    }
})

DEMO: http://jsfiddle.net/nV4SA/10/

$.support API docs: http://api.jquery.com/jQuery.support/

EDIT: Note that $.support.changeBubbles is true in IE9 but not IE <9. Solution may not be bulletproof. Although frowned upon you may need to use browser sniffing or try finding other support properties in $.support that work in all versions of IE only

Upvotes: 2

Related Questions