exceedinglife Posted January 20, 2019 Share Posted January 20, 2019 Hello all, I have a quick question that should actually be really simple but I haven’t been able to find it online through MANY searches. I have an HTML form and a submit button. In the form I have an ‘onsubmit()’ event which does validation. How do I call a submit function after I return my onsubmit value if true do ‘thissubmit()’ I currently have a onsubmit function() If my function returns true then I call - document.forms["formsignin"].submit(); return true; That goes to my jQuery ‘$(myForm).on("submit", function () {}’ I want to do this in JavaScript ONLY and NOT with the $( myform).on() jQuery way. <form id="fsignin" onsubmit="return validateit();"> ... <button type=”submit”>Sign in</button> </form> Function validateit() { do validation stuff if(….){document.forms["formsignin"].submit(); return true; } } $(myForm).on("submit", function () { if (validateit()) {} } Quote Link to comment https://forums.phpfreaks.com/topic/308199-js-onsubmit-next-call-a-submit-not-jquery-only-javascript/ Share on other sites More sharing options...
kicken Posted January 20, 2019 Share Posted January 20, 2019 Why do you want to call .submit() on the form? The way a submit handler is supposed to work is you do your validation and if it fails you cancel the submit event. Otherwise you allow the submit event to proceed and the browser will submit the form. $(myForm).on("submit", function(e){ if (!validateit()){ e.preventDefault(); } }); function validateit(){ //Do your validations //Return true or false } Quote Link to comment https://forums.phpfreaks.com/topic/308199-js-onsubmit-next-call-a-submit-not-jquery-only-javascript/#findComment-1563693 Share on other sites More sharing options...
exceedinglife Posted January 20, 2019 Author Share Posted January 20, 2019 $(myForm).on("submit", function(e){ if (validateit()){ //created message and displayed in a div } else { e.preventDefault(); } }); function validateit(){ //Do your validations //Return true or false if true document.forms["formsignin"].submit(); } not valid I display a message saying unsuccessful and I display why its not valid. I wanted to do this in only JavaScript and not using the jQuery selectors. Is there a way I can call this in purely JavaScript and not jQuery $(myForm).on("submit", function(e){ Quote Link to comment https://forums.phpfreaks.com/topic/308199-js-onsubmit-next-call-a-submit-not-jquery-only-javascript/#findComment-1563694 Share on other sites More sharing options...
Barand Posted January 20, 2019 Share Posted January 20, 2019 If you don't want to submit, return false from your validate function. EG <html> <head> <title>test</title> <script type='text/javascript'> function checkData() { return document.getElementById('chck').value != '' } </script> </head> <body> <form onsubmit='return checkData()'> <input type='text' name='chck' id='chck' value=''> <input type='submit' name='btnSub' id='Submit'> </form></body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/308199-js-onsubmit-next-call-a-submit-not-jquery-only-javascript/#findComment-1563695 Share on other sites More sharing options...
kicken Posted January 20, 2019 Share Posted January 20, 2019 The plain javascript way to attach event listeners is to use the addEventListener method. Other than that it's the same. document.forms["formsignin"].addEventListener('submit', function(e){ if (!validateIt()){ e.preventDefault(); } }); function validateIt(){ //Do your validations return true; //or false } Do your validations and if your validation fails call e.preventDefault(). Quote Link to comment https://forums.phpfreaks.com/topic/308199-js-onsubmit-next-call-a-submit-not-jquery-only-javascript/#findComment-1563704 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.