jquery - How to display a input textbox of particular div when selecting a value from select box? -
i have select box containing values shown below :
<div> <select class="skilltest"> <option>enter</option> <option class="add">add</option> </select> </div> <div class="disableskill"> <input type="text" class="form-control" name="advanced" id="exampleinputname" placeholder="tell me skill level"> </div> //next same div above <div> <select class="skilltest"> <option>enter</option> <option class="add">add</option> </select> </div> <div class="disableskill"> <input type="text" class="form-control" name="advanced" id="exampleinputname" placeholder="tell me skill level"> </div>
i have multiple divs using class padnone. when clicking value advanced of particular div class padnone, should display input text box inside div class named disableskill of particular main div.
i have written jquery it, displaying input text boxes of every div.
$("select.skilltest").change(function() { alert("checkbox checked."); var skillvalue=$(this).val(); alert(skillvalue); if(skillvalue == "add") { alert("checkbox checked."); $(this).find("div.disableskill").show(); } else{ $(this).find("div.disableskill").hide(); } });
can solution ?
if understand well, try this:
$("div.disableskill").hide(); $("select.skilltest").change(function() { var closestselect = $(this).parent(); var skillvalue = $(this).val(); if(skillvalue == "add") { $(closestselect).next().show(); } else{ $(closestselect).next().hide(); } });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> <select class="skilltest"> <option>enter</option> <option class="add">add</option> </select> </div> <div class="disableskill"> <input type="text" class="form-control" name="advanced" id="exampleinputname" placeholder="tell me skill level"> </div> //next same div above <div> <select class="skilltest"> <option>enter</option> <option class="add">add</option> </select> </div> <div class="disableskill"> <input type="text" class="form-control" name="advanced" id="exampleinputname" placeholder="tell me skill level"> </div>
Comments
Post a Comment