CODEWITHSUNDEEP
jqueryhtmlformsvalidationsubmit-button
Benny Code
Benny Code

Reputation: 54995

jQuery submit button event handler prevents form validation for required input fields

I have a HTML form with input fields which are required, for example:

<input type="number" required="required" />

The submit button of my form is controlled by a jQuery event handler:

$('#submitButton').on('click', function(event){
  return false;
});

The fact that the submit button handler returns false leads to the problem that there is no automatic check for the required fields by the web browser. If I remove "return false" then there is a check (see screenshot) but then the page gets reloaded (which I don't want).

Is there a way, to use the browser's error correction without a page refresh after a form submit action?

enter image description here

Upvotes: 0

Views: 960

Answers (1)

mcintyre321
mcintyre321

Reputation: 13316

I think you want to try something like:

$('#submitButton').on('click', function(event){
    return $("<some selector for the input>")[0].checkValidity();
});

Upvotes: 1

Related Questions