Enable submit button when filling in some field with text
20,844
Solution 1
Using jQuery:
$(document).ready(function() {
$('#bttnsubmit').attr('disabled','disabled');
$('input[type="text"]').keyup(function() {
if($(this).val() != '') {
$('input[type="submit"]').removeAttr('disabled');
}
});
});
source: jQuery disable/enable submit button
Solution 2
The existing code in the question worked fine, but gets disabled when the text is removed. This may be desired by others but you could make a small change to have it permanently removed without needing jquery (jquery wasn't in the tags)
function toggleButton(ref,bttnID){
document.getElementById(bttnID).removeAttribute("disabled");
}
and add onkeyup="toggleButton(this,'bttnsubmit')
to any fields that need to enable the button
Solution 3
Adding the final code that did the trick:
<script type="text/javascript">
$(document).ready(function() {
$('#bttnsubmit').attr('disabled','disabled');
$('#subEmail').keyup(function() {
if($(this).val() != '') {
$('#bttnsubmit').removeAttr('disabled');
}
else {
$('#bttnsubmit').attr('disabled','disabled');
}
});
});
</script>
Author by
samyb8
Updated on February 01, 2020Comments
-
samyb8 over 4 years
I have the following form and javascript:
<script type="text/javascript"> function toggleButton(ref,bttnID){ document.getElementById(bttnID).disabled= ((ref.value !== ref.defaultValue) ? false : true); } </script> <form action="" method="post" id="subscribe" name="subscribe"> <label>NAME:</label> <input type="text" name="name" class="subName" onkeyup="toggleButton(this,'bttnsubmit');"> <label>EMAIL:</label> <input type="text" name="email" class="subEmail" id="sub_email"> <input type="button" name="button" value="Subscribe" disabled='disabled' id='bttnsubmit'/> </form>
When I first load my site the SUBMIT button is disabled, as I wanted, since the text field has no text in it. Now I would like to enable the button once some text has been placed within the text field.
Any help please?
-
Zizzipupp over 4 yearsHow do you make sure this function targets the right buttons??