jquery - Javascript onchange function doesn't change div -
this question has answer here:
so don't know how to go having onchange function populate div radio button connected since i'm not familiar how javascript works tried pasting html in javascript....the tables radio button supposed populate connected div check boxes while view radio button supposed have div empty. codepen http://codepen.io/markbond/pen/jdozaw?editors=101 btw done in bootstrap
javascript:
function changeselection() { if (document.getelementbyid("selectiontables").checked) { document.getelementbyid("dropdownmenuselect").innerhtml = "tables"; document.getelementbyid("populatecheckboxes").innerhtml = ""; } else { document.getelementbyid("dropdownmenuselect").innerhtml = "views"; document.getelementbyid("unpopulatecheckboxes").innerhtml = ""; } } html:
this isn't anywhere in codepen because have no idea put :/
<div class="checkbox"> <label> <input type="checkbox" id="selectioncondition" />condition </label> </div> <div class="checkbox"> <label> <input type="checkbox" id="selectiondistribution" />distribution </label> </div> <div class="checkbox"> <label> <input type="checkbox" id="selectionprogram" />program </label> </div> <div class="checkbox"> <label> <input type="checkbox" id="selectiontreatment" />treatment </label> </div> heres radio button , dropdown:
<form role="form"> <div class="row"> <div class="radio col-xs-2" id="populateselection" onchange="changeselection()"> <label> <input type="radio" name="optradio" id="selectiontables" />use tables </label> <label> <input type="radio" name="optradio" id="selectionviews" />use views </label> </div> <div class="dropdown col-xs-10"> <!--dropdown button--> <button class="btn btn-default dropdown-toggle btn-xs btn-orange" type="button" id="dropdownmenuselect" data-toggle="dropdown" aria-expanded="true" style="margin-top:10px"> tables <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownmenuselect"> <!--dropdown menu--> <li role="presentation"><a role="menuitem" tabindex="-1" class="link-no-jump" href="#graphonechart">chart</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" class="link-no-jump" href="#graphonedata">data</a></li> </ul> </div> </div> <div class="row" id="populatecheckboxes"></div> <div class="row" id="unpopulatecheckboxes"></div> </form>
the div doesn't change, onchange not going work. try this:
<label> <input type="radio" name="optradio" id="selectiontables" onchange="changeselection()" />use tables </label> <label> <input type="radio" name="optradio" id="selectionviews" onchange="changeselection()"/>use views </label>
Comments
Post a Comment