Search This Blog

Sunday, September 2, 2012

Press Enter key and change Tab

Write  javascript code into js file named jskeypresstab.js.

$(':text').live("keypress", function(e) {
    /* ENTER PRESSED*/
    if (e.keyCode == 13) {

        /* FOCUS ELEMENT */
        var inputs = $(this).parents("form").eq(0).find(":input");
        var idx = inputs.index(this);
        if (idx == inputs.length - 1) {
            inputs[0].select()
        } else {
            inputs[idx + 1].focus(); // handles submit buttons
            inputs[idx + 1].select();
        }

        return false;
    }
});

$('select').live("keypress", function(e) {
    /* ENTER PRESSED*/
    if (e.keyCode == 13) {
        /* FOCUS ELEMENT */
        var inputs = $(this).parents("form").eq(0).find(":input");
        var idx = inputs.index(this);
        if (idx == inputs.length - 1) {
            inputs[0].select()
        } else {
            inputs[idx + 1].focus(); // handles submit buttons
            inputs[idx + 1].select();
        }

        return false;
    }
});


$('textarea').live("keypress", function (e) {
        /* ENTER PRESSED*/
        if (e.keyCode == 13) {

            /* FOCUS ELEMENT */
            var inputs = $(this).parents("form").eq(0).find(":input");
            var idx = inputs.index(this);
            if (idx == inputs.length - 1) {
                inputs[0].select();
            } else {
                inputs[idx + 1].focus(); // handles submit buttons
                inputs[idx + 1].select();
            }

            return false;
        }
    });

In html code:

Add reference in head code;

jquery-1.4.4.min.js
jskeypresstab.js

3 comments: