Allereerst heb je een dubbele id
waarde in uw HTML. Ik neem aan dat de div
mag geen bir
. hebben maar biro
als id
attribuutwaarde.
Je zou dan een data-dept
. kunnen toevoegen naar de option
elementen die u dynamisch toevoegt aan de tweede vervolgkeuzelijst en deze de waarde geeft van de deptId
:
foreach ($birs as $rl)
{
?>
<option value="<?php echo $rl->birId ?>"
data-dept="<?php echo $rl->deptId ?>" >
<?php echo $rl->birName ?></option>
<?php
}
Lees die waarde vervolgens in het script uit met dataset.dept
(zorg ervoor dat je de id
van de div hebt gecorrigeerd attribuut in de HTML).
Hier is een fragment (zonder PHP):
function checkvalue(val) {
if (+val) {
for (var option of bir.options) {
if (option.dataset.dept) { // don't touch first entry
option.style.display = option.dataset.dept == val ? '' : 'none';
}
}
}
bir.value = 0; // reset selection
biro.style.display = +val ? '' : 'none'; // show/hide
}
function checkvalues(val) {}
<div class="col-md-6">
<div class="form-group">
<label for="Dept">Dept</label>
<select class="form-control required" id="Dept" name="Dept" onchange='checkvalue(this.value)'>
<option value="0">Dept</option>
<option value="2">2</option>
<option value="5">5</option>
</select>
</div>
</div>
<div class="col-md-6" >
<div class="form-group" id="biro" style='display:none'>
<label for="bir">Bir</label>
<select class="form-control required" id="bir" name="bir" onchange='checkvalues(this.value)'>
<option value="0">Pilih Bir</option>
<option value="9" data-dept="2">bir for 2</option>
<option value="10" data-dept="5">bir for 5</option>
<option value="8" data-dept="2">another bir for 2</option>
<option value="15" data-dept="5">another bir for 5</option>
</select>
</div>
</div>