jquery - check length of input field?
JqueryJquery Problem Overview
The code below is intended to enable the submit button once the user clicks in the textarea field. It works, but I'm trying to also make it so that it's only enabled if there's at least one character in the field. I tried wrapping it in:
if ($(this).val().length > 1)
{
}
But, that didn't seem to work... Any ideas?
$("#fbss").focus(function () {
$(this).select();
if ($(this).val() == "Default text") {
$(this).val("");
$("input[id=fbss-submit]").removeClass();
$("input[id=fbss-submit]").attr('disabled', false);
$("input[id= fbss-submit]").attr('class', '.enableSubmit');
if ($('.charsRemaining')) {
$('.charsRemaining').remove();
$("textarea[id=fbss]").maxlength({
maxCharacters: 190,
status: true,
statusClass: 'charsRemaining',
statusText: 'characters left',
notificationClass: 'notification',
showAlert: false,
alertText: 'You have exceeded the maximum amount of characters',
slider: false
});
}
}
});
Jquery Solutions
Solution 1 - Jquery
That doesn't work because, judging by the rest of the code, the initial value of the text input is "Default text" - which is more than one character, and so your if
condition is always true.
The simplest way to make it work, it seems to me, is to account for this case:
var value = $(this).val();
if ( value.length > 0 && value != "Default text" ) ...
Solution 2 - Jquery
If you mean that you want to enable the submit after the user has typed at least one character, then you need to attach a key event that will check it for you.
Something like:
$("#fbss").keypress(function() {
if($(this).val().length > 1) {
// Enable submit button
} else {
// Disable submit button
}
});
Solution 3 - Jquery
alternatively using keyup()
$("#fbss").keyup(function() {
if($(this).val().length >1) {
$('#submit').prop('disabled', false);
}
});