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>