Auto Submit Form with Javascript

Question

 function onSubmit() { if (document.getElementById('password').value == '1' && document.getElementById('password2').value == '1') { window.location.href = 'http://google.co.in'; } else{ alert('Please check your passcode and try again'); } }

 <fieldset> <form class="hero-form" action="#"> <div class="row-fluid"> <label>Enter your passcode</label> <input type="password" name="password" maxlength="1" class="span7" id="password" required/> <input type="password" name="password" maxlength="1" class="span7" id="password2" required/> </div> </form> </fieldset> <button class="btn btn-info btn-large span5" id="joe_btn" onclick="onSubmit()">Enter</button>

Is it possible to have the form auto submit after the password is entered, instead of having to press a submit button? For example, allowing the user to keep trying numbers until they get it correct.

Answer 1

 function onSubmit() { if (document.getElementById('password').value && document.getElementById('password2').value) { if (document.getElementById('password').value == '1' && document.getElementById('password2').value == '1') { window.location.href = 'http://google.co.in'; } else { alert('Please check your passcode and try again'); } } }

 <fieldset> <form class="hero-form" action="#"> <div class="row-fluid"> <label>Enter your passcode</label> <input type="password" name="password" maxlength="1" class="span7" id="password" required oninput="onSubmit()" /> <input type="password" name="password" maxlength="1" class="span7" id="password2" required oninput="onSubmit()" /> </div> </form> </fieldset>

Answer 2

You mean something like this? I delegate the test of input to the form

I also fixed your weird HTML structure

 window.addEventListener("load", function() { document.getElementById("heroForm").addEventListener("input", function(e) { const val1 = document.getElementById('password').value; const val2 = document.getElementById('password2').value; if (val1 && val2) { if (val1 === '1' && val2 === '1') { window.location.href = 'http://google.co.in'; } else { alert('Please check your passcode and try again'); } } }) })

 <form id="heroForm" class="hero-form" action="#"> <fieldset class="row-fluid"> <label>Enter your passcode</label> <input type="password" name="password" maxlength="1" class="span7" id="password" required/> <input type="password" name="password" maxlength="1" class="span7" id="password2" required/> </fieldset> </form>