Disable enter button from triggering submit

By: Bobby Singh | Asked: 05/16/2022
ForumsCategory: Code HelpDisable enter button from triggering submit
Bobby Singh asked 2 years ago
Hey Guys,   Can someone help me figure out out to disable the enter button from triggering the submit button? I added a calculator to my form but whenever you hit button after typing in a number it tries to submit the form.
Bobby Clapp replied 2 years ago

According to an article on stack overflow:

$(document).ready(function() {
$(window).keydown(function(event){
if(event.keyCode == 13) {
event.preventDefault();
return false;
}
});
});

Bobby Singh replied 2 years ago

Forgive my ignorance, but where do I input the code? I'm using WordPress.

1 Answers
Victor Font answered 2 years ago
Depending on the browser, the keydown() functions returns either "Enter" or "13". You also have to disable the space bar because in some browsers, it also triggers a submit. This is the code I use: jQuery(document).ready(function($) { "use strict"; $("#").on('submit', function(e) { e.preventDefault(); return false; }); $(window).on("keydown", function(event) { /* Enter & Space are required for Safari, the Chromium based MS Edge, and Chrome. Firefox works with key codes */ if ( event.which == 'Enter' || event.which == 'Space' || event.which == 13 || event.which == 32 ) { event.preventDefault(); return false; } }); });
Bobby Singh replied 2 years ago

Forgive my ignorance, but where do I input the code? I'm using WordPress.

Victor Font replied 2 years ago

jQuery goes anywhere your system allows you to use use custom jQuery code on a page. The where in this case is specific to your site/theme. You can also add jQuery to the after fields area on the form's customize HTML page or in the after content area of a view.

Bobby Clapp replied 2 years ago

Wrap any code snippet above with and drop it in the after fields area as noted as a quick check. Then you might decide to put it somewhere that makes more sense.

Bobby Singh replied 2 years ago

Okay so when I try to add the code to the After field in the Customize HTML field in settings ... It just shows the code on the page. What am I doing wrong?

Bobby Clapp replied 2 years ago

Did you wrap it with script tags?

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right