Зависимые выпадающие списки

Для того, чтобы сделать выпадающие меню, зависящие от других меню в Yii2 можно использовать плагин http://demos.krajee.com/widget-details/depdrop

Для начала создадим форму:

<?= $form->field($model, 'country')->dropDownList(City::getCountryList(),
        [
            'prompt'=>'Выберите страну',
            'id'=>'country_id',
        ]) ?>

Здесь создается обычный объект dropDownList. Тут необходимо указать id  в параметрах для поля

Далее подключаем widget  DepDrop

<?= $form->field($model, 'city')->widget(\kartik\depdrop\DepDrop::class, [
    'options' => ['id' => 'city_id'],
    'pluginOptions' => [
        'depends' => ['country_id'],
        'placeholder' => 'Выберите город',
        'url' => \yii\helpers\Url::to(['/city/cities']),
        'initialize' => true,
    ]
]) ?>

Тут необходимо указать от чего форма будет зависима, в данном случае от  country_id. Так же указываем ‘url’ — это экшн, из которого будет брать списки с помощью AJAX

в экшене city/cities:

$parents = Yii::$app->request->post('depdrop_parents', null);
if ($parents != null) {
    $country = $parents[0];
    $arr = City::find()->where(['country'=>$country])->all();
    return Json::encode([
        'output'=>GlobFunc::prepareToDepDrop($arr, 'name'),
        'selected'=>$country
    ]);
}

return Json::encode(['output'=>'', 'selected'=>'']);

методом post передается параметр depdrop_parents, в котором первым элементом передается id выбранного в dropDownList значения. Поэтому не мешает проверить передался он вообще или нет. Далее идет банальная выборка из БД и подготовка массива, для передачи обратно в форму.

Массив должен быть такой:

[
  ['id'=>1, 'name'=>'Moscow'], 
  ['id'=>2, 'name'=>'Saint-Peterburg'], 
...
]

Далее массив кодируется в

Json::encode(['output'=>$arr, 'selected'=>5]);

Где в  output — складывается полученный массив в selected складывается ID выбранного элемента загружаемого списка

Если ничего не найдено, то возвращаем (тоже в Json) массив вида: [‘output’=», ‘selected’=>»]

Довольно исчерпывающая документация с реальными примерами находится тут: http://demos.krajee.com/widget-details/depdrop

Leave a comment

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.