Question

I have used jQuery validation, but it is not working on pressing enter key in Magento2.2.5?

But works on Submit button.

Refer my code.

    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script type="text/javascript">
require([
    'jquery'
], function($){

// jQuery(document).ready(function(){

// jQuery('.input').keypress(function(e) {
//    if (e.which == 13) {
//       alert('ok');
//       $('#custom-form').submit();
//       return false;
//     }
//     });

jQuery(document).keypress(function(event){

    var keycode = (event.keyCode ? event.keyCode : event.which);
    if(keycode == '13'){
        //alert('You pressed a "enter" key in somewhere');    
        jQuery('#custom-form').submit();
        return false;
    }


jQuery("#custom-form").validate({
    rules: {
      first_name: "required",
      last_name: "required",
       email: {
        required: true,
        email: true
      },
      phone_no:{
        required:true,
        number:true
      },
      address1: "required",
      city: "required",
      region: "required",
      postcode: "required",
      authenticity: "required",
      style: "required",
      retailer: "required"
  },
  messages: {
      first_name: "Please enter your Firstname",
      last_name: "Please enter your Lastname",
      email: "Please enter a valid Email Address",
      phone_no: {
      required: "Please enter your Phone Number",
      number:"Please enter numbers Only"
      },
      address1: "Please enter your Address",
      city: "Please enter your City",
      region: "Please enter your State/Province",
      postcode: "Please enter your Zipcode",
      authenticity: "Please enter your Authenticity",
      style: "Please enter your Style",
      retailer: "Please enter your Retailer"
  },
    submitHandler: function(form, event) { 
        event.preventDefault();
        // alert("Do some stuff...");
        form.submit();
        //submit via ajax
     }

  });
});
});
</script>

Any help would be appreciated.

Was it helpful?

Solution

To check if an enter key is pressed on page, bind the keypress() to the jQuery $(document).

$(document).keypress(function(event){

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

});

to check if the submit button is pressed

    $("#myButton").click(function() { 
      alert("Click code executed.");
 });
Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top