1

Есть 3 select. Задача в организации зависимости 2-го от 1-го, 3-го от 2-го. Вроде получается, но почему-то 3-й select упорно работает только с первым option, все остальные не работают. Подскажите, где ошибка, никак не могу разобраться.

function fcat_onchange()
                {
                    var fcat = document.getElementById("fcat");
                    var scat = document.getElementById("scat");
                    scat.selectedIndex = 0;
                    for (var i = 0; i < scat.childNodes.length; i++)
                    {
                        var cur = scat.childNodes.item(i);
                        if (cur.nodeName.toLowerCase() == "optgroup")
                        {
                            cur.style.display = cur.id == fcat.value.toLowerCase() ? "block" : "none";
                        }
                    }
                }
                function scat_onchange()
                {
                    var scat = document.getElementById("scat");
                    var catid = document.getElementById("catid");
                    
                    catid.selectedIndex = 0;
                    for (var j = 0; j < catid.childNodes.length; j++)
                    {
                        var cur = catid.childNodes.item(j);
                        if (cur.nodeName.toLowerCase() == "optgroup")
                        {
                            cur.style.display = cur.id == scat.value.toLowerCase() ? "block" : "none";
                        }
                    }
                }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row"> 
<div class="col-md-3">
    <div class="form-group">
        <select class="form-control" id="fcat" onchange="return fcat_onchange()">
            <option value="" selected>Выбрать из списка...</option>
            <option value="r1">Отечественный опыт</option>
            <option value="r2">Зарубежный опыт</option>
        </select>
        <label class="text-grey"><small><em>Категория</em></small></label>
    </div>
</div>
<br>
<div class="col-md-3">
    <div class="form-group">
        <select class="form-control" id="scat" onchange="return scat_onchange()">
            <option value="">Выберите категорию</option>
            <optgroup label="Отечественный опыт" id="r1" hidden>
                <option value="с11">Общие вопросы</option>
                <option value="с12">Организационная деятельность</option>
                <option value="с13">Оценка и контроль</option>
            </optgroup>
			<optgroup label="Зарубежный опыт" id="r2" hidden>
                <option value="с21">Оценка и контроль</option>
                <option value="с22">Общие вопросы</option>
                <option value="с23">Организационная деятельность</option>
            </optgroup>
        </select>
        <label class="text-grey"><small><em>Раздел</em></small></label>
    </div>
</div>
<br>
<div class="col-md-6">
    <div class="form-group">
        <select class="form-control" id="catid" name="catid">
            <option value="">Выберите раздел</option>
            <optgroup label="Общие вопросы" id="с11" hidden>
				<option>Оценка и контроль</option>
                <option>Организационная деятельность</option>
                <option>Общие вопросы</option>
			</optgroup>
			<optgroup label="Организационно-управленческая деятельность" id="c12" hidden>
				<option>Общие вопросы</option>
                <option>Оценка и контроль</option>
                <option>Организационная деятельность</option>
			</optgroup>
			<optgroup label="Оценка и контроль" id="c13" hidden>
				<option>Организационная деятельность</option>
                <option>Общие вопросы</option>
                <option>Оценка и контроль</option>
			</optgroup>
			<optgroup label="Общие вопросы" id="с21" hidden>
				<option>Организационная деятельность</option>
                <option>Общие вопросы</option>
                <option>Оценка и контроль</option>
			</optgroup>
			<optgroup label="Организационно-управленческая деятельность" id="c22" hidden>
				<option>Общие вопросы</option>
                <option>Организационная деятельность</option>
                <option>Оценка и контроль</option>
			</optgroup>
			<optgroup label="Оценка и контроль" id="c23" hidden>
				<option>Оценка и контроль</option>
                <option>Общие вопросы</option>
                <option>Организационная деятельность</option>
			</optgroup>
        </select>
        <label class="text-grey"><small><em>Рубрика</em></small></label>
    </div>
</div>
</div>

1 ответ 1

1

Буквы с и c - из разных алфавитов. Используйте какую-нибудь другую букву, которую труднее перепутать. Например, o :).

2
  • Черт побери, а ведь проверял на этот момент тоже... видимо надо иногда отвлекаться от работы. Спасибо! Commented 4 февр. 2020 в 17:11
  • @OlegKasumoff На здоровье. Знак "галочка" - слева от ответа.
    – user176262
    Commented 4 февр. 2020 в 17:18

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.