How do i prevent my form from submitting when a user presses enter

I have a form on my page and i want the user to only be able to submit the form by clicking on the forms's submit button. Because i have specific process for the form submission and when the user presses enter the process is not followed instead the page refreshes.

This is my form

<form class="form-horizontal" onsubmit="myForm()">
   <div class="form-group">
   <input id='nav-search' type="text" class=" form-control" style="width: 100%">
   </div>
</form>

Admin

2022-03-31

This can be achieved easily by adding the atrribute shown below to your form

onkeydown="return event.key != 'Enter';"

Your form should now look like this

<form class="form-horizontal" onsubmit="myForm()" onkeydown="return event.key != 'Enter';">
   <div class="form-group">
   <input id='nav-search' type="text" class=" form-control" style="width: 100%">
   </div>
</form>

Adding the attribute prevents form submission if the user presses enter.

How do i prevent my form from submitting when a user presses enter

Add Message

Tags

Thread detail

Privacy Policy