I have been trying to make a form in which as and when a checkbox is checked, the button is enabled. I tried jquery and javascript, but they are not helping.
HTML code of form:
<form>
Name*: <input type="text" size="20" name="name" required /> <br /><br />
Surname: <input type="text" size="20" /> <br />
<br /><br />
Mobile number: <input type="tel" size="15" /> <br /><br />
E-mail id*: <input type="Email" size="30" name="usr_id" required /> <br /><br />
Password*: <input type="Password" size="30" id="pw1" required /> <br /><br />
Confirm Password*: <input type="password" size="30" id="pw2" required /> <br /><br /><br /><br />
I accept the terms and conditions <input class="chk" type="checkbox" id="tc" /><br /><br />
<input type="submit" id="btn" class="btn btn-lg btn-primary" value="Sign up" onclick="form_function()"/>
</form>
Javascript-form_function:
function form_function(){
var pw1 = document.getElementById('pw1').value;
var pw2 = document.getElementById('pw2').value;
if (pw1 == pw2){
document.getElementById('btn').onclick = window.location.href("http://ift.tt/2gzJRn2");
} else {
document.getElementById('btn').onclick = window.alert("Please make sure that both the password fields have the same text");
}
}
Javascript to conditionally disable button:
$('#btn').prop("disabled", true);
$('#tc').click(function() {
if ($(this).is(':checked')) {
$('#btn').prop("disabled", false);
} else {
$('#btn').attr('disabled',true);}
}
});
form_function() is working fine, but the checkbox-button relation is not working out. Even when the checkbox is not checked, the button is in enabled state, and caries out form_function().
Aucun commentaire:
Enregistrer un commentaire