Вывод двумерного массива (PHP) через два выпадающих списка

Рейтинг: 0Ответов: 1Опубликовано: 01.03.2015

Всем привет. Задача: показать пользователю два выпадающих списка (вывод второго на основании первого).

Пример: пользователь выбирает название улицы (выпадающий список) и ему в соседнем выпадающем списке показываются номера домов, которые есть именно на этой улице.

Вот собственно массив: <? $mkr = array ("4 МКР-Н" => array(19, 20, 23, 24), "5 МКР-Н" => array(1, 6, 7, 11)); ?>

Ответы

▲ 1Принят

Вариантов реализации может быть много. Например:

Выводишь первый селект с улицами

<select class="streets">
    <?foreach($mkr as $k => $v){?>
        <option value="<?=$k?>"><?=$k?></option>
    <?}?>
</select>

Выводишь все возможные селекты выбора номера. Все они по дефолту скрыты (style="display: none")

<?foreach($mkr as $k => $v){?>
    <select style="display: none" class="numbers" data-street="<?=$k?>">
        <?foreach($v as $n){?>
            <option value="" data-number="<?=$n?>"><?=$n?></option>
        <?}?>
    </select>
<?}?>

Добавляешь обработчик на событие смены опции у первого селекта. При каждой смене берется value выбранной опции. Затем скрываются все селекты с номерами и показывается один с выбранным data-street. Для данного куска js кода необходима библиотека jquery

<script type="text/javascript">
    $(function(){

        $('.streets').on('change', function(){
            var optionSelected = $(this).find("option:selected");
            var valueSelected  = optionSelected.val();

            $('.numbers').hide();
            $('.numbers[data-street="'+valueSelected+'"]').show();
        });

    });
</script>