javascript - Check the content of an input field using jquery -
i new javascript , have form, when try retrieve user information, not work correctly.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <form method="post" action=""> <div class="form-row"> <label> <span>register</span> <select name="register_as" id="dropdown"> <option value="none">select one</option> <option value="user">user</option> <option value="designer">designer</option> </select> </label> </div> <div> <label><span>gender</span></label> <div class="form-radio-buttons"> <div> <label> <input type="radio" name="gender" value="male"> <span>male</span> </label> </div> <div> <label> <input type="radio" name="gender" value="female"> <span>female</span> </label> </div> </div> </div> <div> <input type="submit"> </div> </form> </body> </html> <script> $(document).ready(function() { $("form").submit(function (e) { //check if gender has not been selected var gender = $(this).find('input[name="gender"]').val(); if(!gender){ alert('select gender'); } //check if 'register_as' equal 'user' or designer var register_as = $("#dropdown").val(); if(register_as!= 'user' | register_as!= 'designer'){ alert('register user or designer'); } e.preventdefault(); }); }); </script>when user wants register, has choose between user , designer. if chooses different alert him. same gender, has choose between male , female.
kindly me solve problem.
to radio group value need use :checked or first 1 time.
var gender = $(this).find('input[name="gender"]:checked').val(); the boolean operator javascript &&
$(document).ready(function() { $("form").submit(function (e) { //check if gender has not been selected var gender = $(this).find('input[name="gender"]:checked').val(); if(!gender){ alert('select gender'); } //check if 'register_as' equal 'user' or designer var register_as = $("#dropdown").val(); if(register_as!= 'user' && register_as!= 'designer'){ alert('register user or designer'); } e.preventdefault(); }); }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form method="post" action=""> <div class="form-row"> <label> <span>register</span> <select name="register_as" id="dropdown"> <option value="none">select one</option> <option value="user">user</option> <option value="designer">designer</option> </select> </label> </div> <div> <label><span>gender</span></label> <div class="form-radio-buttons"> <div> <label> <input type="radio" name="gender" value="male"> <span>male</span> </label> </div> <div> <label> <input type="radio" name="gender" value="female"> <span>female</span> </label> </div> </div> </div> <div> <input type="submit"> </div> </form>
Comments
Post a Comment