Skip to content Skip to sidebar Skip to footer
Home / Html / Javascript / Jquery

Jquery Event Keypress: Enter Key

Post a Comment
i have a combo box which has got values and i want to give the user to select the values when the Enter key pressed. User can navigate through Arrow key Select the value when use

Solution 1: 

<select><optionvalue="1">1</option><optionvalue="2">2</option></select><script> 
 $('select').live('keypress',function(e){
     var p = e.which;
     if(p==13){
         alert('enter was pressed');
     }
 });
 </script>

Solution 2:

Try this one 

$('#cmb_CIMtrek_DailyshipCo_CustomerName select').keypress(function(event){

        var keycode = (event.keyCode ? event.keyCode : event.which);
        if(keycode == '13'){
            alert('You pressed a "enter" key in textbox');  
        }
        event.stopPropagation();
    });

Solution 3:

If you want to post the form when the user presses enter you could also use a submit button which has this behaviour as a default.

If you don't want to post the form but do have a submit button, this might catch the key event and doesn't propagate.So remove any submit-button.

To restrict the event to an object use:

if (e.target == document.getElementById('element-id'))

or jquery

if (this == $('#element-id').get(0))

Your code would look something like this:

$(document).bind('keypress', function(e) 
    {
    // Use 'this' or 'e.target' (whithout quotes)if (this == $('#cmb_CIMtrek_DailyshipCo_CustomerName select').get(0))
        {
        var code = (e.keyCode ? e.keyCode : e.which);
        if(code == 13)
            { //Enter keycode//Do somethingalert("Enter key Pressed");
            }
        }
    // Stop the event from triggering anything else
    e.stopPropagation();
    });

Solution 4:

For example: 

<!html><head><scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script></head><divclass="form-group"><labelfor="exampleFormControlSelect1">Bodega</label><selectclass="form-control"id="exampleFormControlSelect1"><optionvalue="despacho">Despacho</option><optionvalue="ventas">Ventas</option></select></div><script>
     $('#exampleFormControlSelect1').on('keypress',function(e){
         var p = e.which;
         if(p==13){
             alert('enter was pressed');
         }
     });
 </script>

Post a Comment for "Jquery Event Keypress: Enter Key"