जावास्क्रिप्ट का उपयोग करके पिछले ड्रॉपडाउन मान के आधार पर दूसरा ड्रॉपडाउन कैसे दिखाया जाए?

सबसे पहले, आपके पास एक डुप्लीकेट id है अपने एचटीएमएल में मूल्य। मुझे लगता है कि div bir नहीं होना चाहिए लेकिन biro id . के रूप में विशेषता मान।

फिर आप एक data-dept add जोड़ सकते हैं option . के लिए तत्व जो आप दूसरी ड्रॉप डाउन में गतिशील रूप से जोड़ते हैं, और इसे deptId का मान देते हैं :

foreach ($birs as $rl)
{
    ?>
    <option value="<?php echo $rl->birId ?>"
            data-dept="<?php echo $rl->deptId ?>" >
        <?php echo $rl->birName ?></option>
    <?php
}

फिर स्क्रिप्ट में, उस मान को dataset.dept . के साथ पढ़ें (सुनिश्चित करें कि आपने div की id को सही कर दिया है एचटीएमएल में विशेषता)।

यहाँ एक स्निपेट है (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>