I have an ASP.Net Core/Razor app with a simple form:

<form method="post" id="my_form">
  ...
</form>

I'm using the built-in client-side validation for things like <input ...required> or <input type="number" min="0" ...> (Microsoft includes jQuery validation in their MSVS project templates). That all works fine.

I'm also doing some additional, custom validation on certain fields. I'd like to give the user the option to either re-do the form, or exit the form altogether and redirect to a different page:

<script type="text/javascript">

// Form submit
$('#my_form').on('submit', function (e) {
    console.log('validateForm...');
    //debugger;

    // Check basic form validation
    let isValid = e.target.checkValidity();
    if (!isValid)
        return false;
    
    // Validate custom field
    let myCustomField = $('#myCustomField').val();
    if (myCustomField != 'xyz') {
        let response = confirm('MyCustom field is invalid: Update webform?');
        if (response) {
            return false;  // Return to webform
        } else {
            window.location.href = "./";  // Redirect to app's landing page
        }
        ...
        return true;
    }
});
</script>

PROBLEM:

window.location.href doesn't redirect me immediately. The validation JS continues on, and the form is POSTed to the server.

Q: Should I use something like location.replace() instead? Or should I take a completely different approach?