Html Form - `required` Attribute Not Triggered With Onclick Confirm

I have a html form with input fields that require a value before submission and to achieve this I am using the required attribute in html5 Which is shown in the snippet below with

Solution 1:

Try using onsubmit on your <form> rather than the button.

<h2>Form Two </h2>
<form method="post" action="example.com" id="delete_page"
      onsubmit="return confirm('Are you sure you want to submit?')">

  Name : <input type="name" required><br>
  <input type="button" value="Cancel">
  <input type="submit" value="Delete">

</form>

Browser form validation only kicks in on a submit event.

This will also prevent your form from submitting if the user chooses to "Cancel" the popup.