Jquery .on('input', function(){...}); not working with IE

Question

I have a perfectly working jquery function on Chrome but it doesn't work with IE... The server gets the get AJAX request every time I change something in the textbox #form but not on IE

$("#form").on('input', function() {
    $("#value").val($("#value").val().toUpperCase());
    var postdata = {value: $("#value").val()} ;
    $.get('/search', postdata, function(data) {
        var result = ("Type : " + data['type'] + "<br/>Project name : " + data['project_name'] + "<br/>Project version : " + data['project_version'] + "<br/>Product name : " + data['product_name'] + "<br/>Product version : " + data['product_version'] + "<br/>Lib op : " + data['libop'])
        $("#print").html(result) ;
    });
});

Do you have a solution for this ?

Thanks ! Best regards,

Servietsky

Which version of IE? The [`oninput` event](http://msdn.microsoft.com/en-us/library/ie/gg592978(v=vs.85).aspx) might not work in IE < 9. Try using `onchange` instead: `$("#form").on('change', function() {`. If you really need to use `oninput` (it's triggered as soon as the input changes, and doesn't wait for it to lose focus like `onchange` does), you can try this: http://www.useragentman.com/blog/2011/05/12/fixing-oninput-in-ie9-using-html5widgets/ — gen_Eric, Oct 14 '13 at 14:59
See also, Mozilla's docs: https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers.oninput — gen_Eric, Oct 14 '13 at 15:05
What rocket is saying been answered before on SO, check here: http://stackoverflow.com/questions/19160902/jquery-oninput-doesnt-get-fired-in-ie8-alone — lgrosales, Oct 14 '13 at 15:05
@DavidFregoli: Obviously that won't work if the text is pasted in, but it may be good enough here. — gen_Eric, Oct 14 '13 at 15:08
Also, which version of jQuery (some newer versions of jQuery do not work with older versions of IE). — Spudley, Oct 14 '13 at 15:11

score 6 · Accepted Answer · edited Oct 14 '13 at 15:53

6

Use onkeyup event

$('input').keyup(function(e) {
    switch (e.which) {
        case 16: break; // Shift
        case 17: break; // Ctrl
        case 18: break; // Alt
        case 27: this.value = ''; break; // Esc: clear entry
        case 35: break; // End
        case 36: break; // Home
        case 37: break; // cursor left
        case 38: break; // cursor up
        case 39: break; // cursor right
        case 40: break; // cursor down
        case 78: break; // N (Opera 9.63+ maps the "." from the number key section to the "N" key too!) (See: http://unixpapa.com/js/key.html search for ". Del")
        case 110: break; // . number block (Opera 9.63+ maps the "." from the number block to the "N" key (78) !!!)
        case 190: break; // .
        default:
        //add your code here which will execute by default
    }
});

Sorry for the long post (specified all events here )

edited Oct 14 '13 at 15:53

gen_Eric

223,194
41
299
337

answered Oct 14 '13 at 15:09

Bhavesh B

1,121
12
25

3

If you are using jQuery, both the `var e = window.event || e;` and `var keyUnicode = e.charCode || e.keyCode;` lines are not needed. jQuery does all of this for you already. The `e` sent in is already normalized. Also, use [`e.which`](http://api.jquery.com/event.which/) in your `switch`. jQuery normalizes that for you too. – gen_Eric Oct 14 '13 at 15:16
I have this problem in old IE (works in newer versions). Only problem with the key up we won't capture changes done via a mouse cut or paste (which I need to handle) – peterc Nov 05 '16 at 00:51

Jquery .on('input', function(){...}); not working with IE

1 Answers1