Yii2: как использовать группы опций с Kartik Select2 на основе AJAX

В настоящее время у меня есть поле формы для отображения статического раскрывающегося списка с группами параметров на основе Select2 от Kartik. Данные заполняются с использованием следующего:

public function getBibliographyList()
{ 
    return ArrayHelper::map($this->find()->select(['id','title','author'])
              ->orderBy('author','title')->all(), 'id', 'title', 'author');
}

Так что заголовки отображаются в соответствующих группах опций автора.

Теперь я хочу переделать форму, чтобы воспользоваться преимуществами AJAX, поэтому я взял пример с Демонстрационный сайт Krajee для Select2 и переработал его следующим образом:

------ ПОСМОТРЕТЬ ----------

<?= $form->field($model, 'orig_id')->widget(Select2::classname(), [
        'options' => ['placeholder' => Yii::t('app', 'Select a title...)],
        'pluginOptions' => [
            'allowClear'         => true,
            'minimumInputLength' => 3,
            'language'           => Yii::$app->language,
            'theme'              => 'krajee',
            'ajax' => [
                'url'      => \yii\helpers\Url::to(['search-doc']),
                'dataType' => 'json',
                'data'     => new JsExpression('function (params) { return {q:params.term}; }'),
            ],
            'errorLoading'      => new JsExpression("function () { return '".Yii::t('app', 'Waiting for data...')."'; }"),
            'escapeMarkup'      => new JsExpression("function (markup) { return markup; }"),
            'templateResult'    => new JsExpression("function (bibliography) { return bibliography.title; }"),
            'templateSelection' => new JsExpression("function (bibliography) { return bibliography.title; }"),
        ],
]) ?>

-------- КОНТРОЛЛЕР -------------

public function actionSearchDoc($q = null)
{
    Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
    $out = ['id' => '', 'title' => '', 'author' => ''];
    if ($q) {
        $query = new yii\db\Query;
        $query->select('id, title, author')
              ->from('bibliography')
              ->where(['like', 'title', $q])
              ->orWhere(['like', 'author', $q])
              ->limit(50);
        $command = $query->createCommand();
        $data    = $command->queryAll();
        $out = array_values($data);
    }
    return \yii\helpers\ArrayHelper::map($out, 'id', 'title', 'author');
}

Согласно документам от Kartik, ArrayHelper::map — это то, что нужно, когда optgroups вокруг, но я не могу понять это, так как раскрывающийся список всегда пуст. Вот пример строки JSON из ArrayHelper::map:

{"results":{"Author1":{"4":"DocumentFoo1","121":"DocumentFoo2","219":"DocumentFoo3","197":"DocumentFoo4","198":"DocumentFoo5","2":"DocumentFoo6","273":"DocumentFoo7"},"Author2":{"68":"DocumentThee1"}}}

Любые идеи?


jquery ajax yii2 kartik-v select2
person Antonio López    schedule 19.02.2017    source источник
comment
не могли бы вы добавить сообщение об ошибке?   -  person marche    schedule 22.02.2017
comment
мммм, я пропустил обратную косую черту в начале строки ArrayHelper, отсюда и эта ошибка. Так или иначе, проблема сопоставления оптгрупп остается. Я буду продолжать попытки, пока не смогу опубликовать правильное решение.   -  person Antonio López    schedule 23.02.2017

Ответы (1)


arrow_upward
3
arrow_downward

Я понял это сам. Во-первых, мы должны позаботиться о необходимой строке JSON для подачи Select2 на основе AJAX, которая должна быть такой (обратите внимание на специальные ключевые слова results, id, text и children, требуемые Select2 на основе AJAX для создания групп выбора):

Array
(
[results] => Array
    (
        [0] => Array
            (
                [text] => "author1"
                [children] => Array
                    (
                        [0] => Array
                            (
                                [id] => "id1"
                                [text] => "title1"
                            )
                        [1] => Array
                            (
                                [id] => "id2"
                                [text] => "title2"  
                            )                           
                    )
            )
        [1] => Array
            (
                [text] => "author2"
                [children] => Array
                    (
                        [0] => Array
                            (
                                [id] => "id3"
                                [text] => "title3"
                            )
                    )
            )
    )
)

Однако вывод четырех аргументов ArrayHelper::map выглядит следующим образом:

Array
(
    [author1] => Array
        (
            [id1] => "title1"
            [id2] => "title2"
        )

    [author2] => Array
        (
            [id3] => "title3"
        )
)

Таким образом, мы должны изменить порядок вещей и включить эти специальные ключевые слова. Следовательно, правильное действие контроллера должно быть таким:

public function actionSearchDoc($q = null)
{
    // JSON format result.
    Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
    $out['results'] = '';
    if ($q) {
        $query = Bibliography::find()->select(['id', 'title', 'author'])
                                     ->where(['like', 'title', $q])
                                     ->orWhere(['like', 'author', $q])
                                     ->all();
        // Group titles by author.
        $authorArray = ArrayHelper::map($query, 'id', 'title', 'author');
        // Previous array lacks keywords needed to use optgroups
        // in AJAX-based Select2: 'results', 'id', 'text', 'children'.
        // Let's insert them.
        $results = []; 
        foreach ($authorArray as $author => $docArray) {
            $docs  = [];
            foreach ($docArray as $id => $title) {
                $docs[] = ['id' => $id, 'text' => $title];
            }
            $results[] = ['text' => $author, 'children' => $docs];
        }
        $out['results'] = $results;
    }
    return $out;
}

Ну это все. Надеюсь, поможет.

person Antonio López    schedule 05.03.2017