JSFiddle - React, Tailwind, and code Playground

by Sumit Kumar

HTML

<body>
    <form id="myForm" name="myForm" action="some.html" method="post">
        <input id="textBox1" name="textBox1" type="text" required="required" title="text1">
        <br/>
        <input id="textBox2" name="textBox2" type="text" required="required" title="text2">
        <br/>
        <div id="hiddenDiv" name="hiddenDiv"></div>
        <input id="reset1" name="reset1" type="submit" value="Reset1">
        <input id="reset2" name="reset2" type="submit" value="Reset2">
        <input id="reset3" name="reset3" type="submit" value="Reset3">
    </form>
</body>

</html>

JavaScript

$(document).ready(function () {

    $('#reset1').button().click(function () {
        // The below line submits the form without validation check
        $("#myForm").attr("action", "test1.html").submit();
    });
    $("#reset2").button().click(function () {
        // The below 2 line always wait for validation check
        $("#hiddenDiv").append('<input type="hidden" name="submit" id="submit" value="reset"/>');
        $("#myForm").attr("action", "test2.html").submit();
    });
    $("#reset3").button().click(function () {
        // The below 2 line always wait for validation check
        $("#hiddenDiv").append('<input type="hidden" name="submit1" id="submit1" value="reset"/>');
        $("#myForm").attr("action", "test3.html").submit();
    });

});