从确认对话框中选择“取消”时，如何停止重置表单输入字段？

Question

I have a form with two buttons and an onclick js function:

  <button name='button1' onclick="backFn()">Change Date Range</button>
  <button name='button2' type='submit' form='form1'>Save</button>

  <script>
   function backFn() {
     let back = confirm("Any unsaved changes will be lost");
       if (back == true) {
          location.href = '/selectdate.php';
       } else {
     }
   }
  </script>

Button2 submits the form as required - no issue there.

Button1 triggers a function opening a confirm dialog box: 'OK' redirects as expected, but I want 'CANCEL' to close the dialog box but retain anything that's been written in the form.

At the moment the cancel option closes the dialog box, but clears the form. How can I retain the form selections/text? (If it's useful pressing 'back' afterwards repopulates the form.)

THANKS!

Answer 1

Add type="button" to button1.

  <button name='button1' type="button" onclick="backFn()">Change Date Range</button>

Without this, the browser will assume the button is meant to submit the form.