javascript - Mandatory field is not working on texarea -
i have form , have fields, filling fields , passing form , decreasing spam written js codes make fields mandatory , disable submit button till filling fields, js works great input type=text not working texarea.
js code
<script type="text/javascript"> $(document).ready(function() { $(function() { $('#sbtbtn').attr('disabled', 'disabled'); }); $('input[type=text],input[type=textarea],input[type=password]').keyup(function() { if ($('#target1').val() !='' && $('#target2').val() != '' && $('#target3').val() != '' && $('#target4').val() != '' && $('#target5').val() != '' && $('#target6').val() != '' && $('#target7').val() != '' && $('#target8').val() != '' && $('#target9').val() != '' && $('#target10').val() != '' && $('#target11').val() != '' && $('#target12').val() != '' && $('#target13').val() != '' && $('#target14').val() != '' && $('#target15').val() != '' && //this textarea id $('#editor1').val() != '') { $('#sbtbtn').removeattr('disabled'); } else { $('#sbtbtn').attr('disabled', 'disabled'); } }); });</script> html code
<form action="insert.php" method="post" class="ara-form" name="theform"> <header>enter job details</header> <fieldset> <div class="row"> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target1" placeholder="job title" name="positiontitle"> <div class="note note-error">this required field.</div> <span class="error"></span> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target2" placeholder="organization / company name" name="companyname"> <div class="note note-error">this required field.</div> </label> </section> </div> <div class="row"> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target3" placeholder="location" name="location" > <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target4" placeholder="job category e.g. it" name="jobcategory"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target5" placeholder="employment type e.g. full time" name="employmenttype"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target6" placeholder="salary e.g. 5000$" name="salary"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target7" placeholder="duration e.g. permanent" name="duration"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target8" placeholder="timing e.g. 8 - 4 pm" name="timing"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target9" placeholder="nationality" name="nationality"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target10" placeholder="number of vacancy e.g. 2 post(s)" name="numberofvacancy"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target11" placeholder="experience e.g. 3 years" name="experience"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" placeholder="closing date" id="datepicker" name="closingdate"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target13" placeholder="gender" name="gender"> <div class="note note-error">this required field.</div> </label> </section> <section class="col col-6"> <label class="input"> <i class="icon-append icon-company"></i> <input type="text" id="target14" placeholder="education e.g. bachelor" name="education"> <div class="note note-error">this required field.</div> </label> </section> </div> </fieldset> <fieldset> <section> <label class="textarea"> tell company background <textarea id="editor1" rows="10" cols="80" name="background" placeholder="tell company background"></textarea> </label> </section> </fieldset> <footer> <p>fill fields activate submit button.</br> thanks</p><i class="fa fa-check" style="float: right; position: relative; right: 22px; color: white; z-index: 1; padding-top: 23px;"></i><input class="button" type="submit" value="submit" id="sbtbtn" /> <div style="float: right; padding-right: 10px;"><?php include "../module/back.php"; ?></div> </footer> </form> any solution appreciated.
you referring textarea input[type=textarea]. wrong.
update script this..
<script type="text/javascript"> $(document).ready(function() { $(function() { $('#sbtbtn').attr('disabled', 'disabled'); }); $('input[type=text],textarea,input[type=password]').keyup(function() { if ($('#target1').val() !='' && $('#target2').val() != '' && $('#target3').val() != '' && $('#target4').val() != '' && $('#target5').val() != '' && $('#target6').val() != '' && $('#target7').val() != '' && $('#target8').val() != '' && $('#target9').val() != '' && $('#target10').val() != '' && $('#target11').val() != '' && $('#target12').val() != '' && $('#target13').val() != '' && $('#target14').val() != '' && $('#target15').val() != '' && //this textarea id $('#editor1').val() != '') { $('#sbtbtn').removeattr('disabled'); } else { $('#sbtbtn').attr('disabled', 'disabled'); } }); });</script>
Comments
Post a Comment