Checking if textarea is empty in jQuery
23,557
Solution 1
Just adding my comment as an answer.
The problem is that you've missed out the &&
before the last condition check.
if ($('#inputName').val() && $('#inputEmail').val() && $('#inputInstrument').val() && $('#inputFee').val() && $('#message').val() != '')
Although that works, you may want to trim() and check the textarea content length.
($('#message').val().trim().length > 0)
Solution 2
You forgot && before the last condition as source.rar mentioned.
Also this isn't the correct way to check that textarea is empty. $('#message').val() != ''
Might be someone type spaces.. so first trim the value and then check..
if ($.trim($('#message').val()).length > 0)
{
}
Solution 3
You have missed && before last condition.
$('#findmusicians-submit').click(function(e){
if ($('#inputName').val()!= '' && $('#inputEmail').val()!= '' && $('#inputInstrument').val()!= '' && $('#inputFee').val()!= '' && $('#message').val() != '')
{
alert('success');
}
else
{
alert('fill in all fields');
}
});
Demo:
Author by
Sebastian
Updated on June 08, 2020Comments
-
Sebastian almost 4 years
Here's my code:
if ($('#inputName').val() && $('#inputEmail').val() && $('#inputInstrument').val() && $('#inputFee').val() $('#message').val() != '') { alert('success'); } else { alert('fill in all fields'); }
If I take out the last condition (
#message
), it works fine, but with it in I get:Uncaught SyntaxError: Unexpected identifier
Here's the HTML:
<form class="form-horizontal" role="form" action="includes/data.php" method="POST" id="findmusicians"> <div class="form-group"> <label for="inputName" class="col-sm-3 control-label">* Name</label> <div class="col-md-7"> <input type="text" name="inputName" class="form-control required" minlength="1" id="inputName"> <div id="hidden"></div> </div> </div> <div class="form-group"> <label for="inputEmail" class="col-sm-3 control-label">* Email</label> <div class="col-md-7"> <input type="email" name="inputEmail" class="form-control" id="inputEmail"> </div> </div> <div class="form-group"> <label for="inputPhone" class="col-sm-3 control-label">Telephone</label> <div class="col-md-7"> <input type="text" name="inputTelephone" class="form-control" id="inputTelephone"> </div> </div> <div class="form-group"> <label for="inputInstrument" class="col-sm-3 control-label">* Instrument(s)</label> <div class="col-md-7"> <input type="text" name="inputInstrument" class="form-control" id="inputInstrument"> </div> </div> <div class="form-group"> <label for="inputFee" class="col-sm-3 control-label">* Fee</label> <div class="col-md-7"> <input type="text" name="inputFee" class="form-control" id="inputFee"> </div> </div> <div class="form-group"> <label for="message" class="col-sm-3 control-label">* Message</label> <div class="col-md-9"> <textarea name="message" id="message" class="form-control" rows="3" style="height: 200px"></textarea> <span class="help-block" style="text-align: left;">Please include as much information as possible including repertoire, rehearsal/performance times and venues.</span> </div> </div> <div class="form-group"> <div class="col-md-3 col-md-offset-3"> <button id="findmusicians-submit" type="submit" class="btn btn-success">Submit request</button> </div> </div> <div class="col-md-9 col-md-offset-3" style="text-align: left; padding-left: 5px"> <span id="result" class="text-success"></span> </div> </form>