Run JS function after form validates on button click
Go one step at a time.... Remove everything besides div with id page1 and run ajax on button click (Remove onClick="metaSQL();
from button as well). Then post the result you get from console.log(data).
<script> $(document).ready(function () { $("#C1").click(function () { $.ajax({ url: '/runPythonFunc', type: 'POST', data: { email: $('#User-Email').val(), entryTwo: $('#Algorithm-Name').val(), entryThree: $('#Algorithm-Desc').val() }, success: function (data, status, jqXHR) { console.log(data); } }); }); });</script><div id="page1" class="page" style="visibility:visible;"> <!-- USER EMAIL --> <label for="Algorithm-Name-3" class="custom-question algorithm-name">Enter your email<br></label><input type="text" class="text-field enter-name w-input" maxlength="256" name="User-Email" data-name="User Email" placeholder="Email address" id="User-Email" required=""> <!-- ALGORITHM NAME --> <label for="Algorithm-Name-3" class="custom-question algorithm-name">What will you name your algorithm?<br></label><input type="text" class="text-field enter-name w-input" maxlength="256" name="Algorithm-Name" data-name="Algorithm Name" placeholder="Be as creative as you like!" id="Algorithm-Name" required=""> <!-- ALGORITHM DESCRIPTION --> <label for="Algorithm-Desc-3" class="custom-question algorithm-desc">Briefly describe what your algorithm does?<br></label><input type="text" class="text-field enter-name w-input" maxlength="256" name="Algorithm-Description" data-name="Algorithm Description" placeholder="You can still be creative!" id="Algorithm-Desc" required=""> <br><br> <p><input type="submit" class="submit-button-2 w-button" id="C1" value="Add Animal" onClick="metaSQL();"></p></div>
take a try
async function function1() { form.action = "/runPythonFunc"; await form.submit(); function2('page2');}