Как использовать ActiveDataProvider с select2?
Я пытаюсь использовать плагин jquery-select2 (загрузка удаленных данных) с моделью поиска Yii2. На данный момент мой контроллер возвращает $ dataProvider, созданный из модели поиска. Однако он явно не в том формате, который select2 может использовать для создания раскрывающегося списка.
Что мне нужно сделать с $ dataProvider или select2, чтобы заставить их работать вместе?
На мой взгляд, есть 2 варианта:
- Извлеките ‘cat_name’ из $ dataProvider и поместите его в формат, который может использовать select2.
- Научите select2 читать $ dataProvider.
Я не уверен, как бы я сделал 2, и я подозреваю, что это затруднит реализацию функциональности «тегирования», поэтому я склоняюсь к 1.
Любая помощь будет оценена.
Вот мой код:
Сторона контроллера
public function actionCatSearch($q)
{
if (Yii::$app->request->isAjax) {
$searchModel = new CatSearch();
$dataProvider = $searchModel->search(['catSearch' => ['cat_name' => $q]]);
return $dataProvider->models;
}
}
Сторона JS
$(document).ready(function(){
$('.js-select').select2({
tags: true,
ajax: {
url: 'cat-search',
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term
};
},
processResults: function (data, page) {
return {
results: data
};
},
cache: true
},
minimumInputLength: 1
});
});
Решение
Прошло некоторое время, но мне удалось это выяснить. Есть несколько вещей, которые должны произойти. Сначала используйте встроенный сериализатор из Yii2, затем json_encode результаты, достижения.
На стороне сценария мне пришлось использовать templateResult,
Здесь все модифицировано:
Сторона контроллера
public function actionCatSearch($q)
{
if (Yii::$app->request->isAjax) {
$searchModel = new CatSearch();
$dataProvider = $searchModel->search(['catSearch' => ['cat_name' => $q]]);
$serial = new Serializer();
$test = $serial->serialize($dataProvider);
return json_encode($test);
}
}
Сторона сценария
function formatStuff (stuff) {
if (stuff.loading) return 'Searching...';
markup = "<p>" + stuff.cat_name + "</p>";
return markup;
}
$(document).ready(function(){
$('.js-select').select2({
tags: true,
ajax: {
url: 'cat-search',
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term
};
},
processResults: function (data, page) {
return {
results: data
};
},
cache: true
},
escapeMarkup: function (markup) { return markup; },
minimumInputLength: 1,
templateResult: formatStuff,
});
});
Другие решения
Попробуйте извлечь нужную колонку из моделей
public function actionCatSearch($q)
{
if (Yii::$app->request->isAjax) {
$searchModel = new CatSearch();
$dataProvider = $searchModel->search(['catSearch' => ['cat_name' => $q]]);
$cat_name = array_column($dataProvider->models, 'cat_name');
return json_encode($cat_name);
}
}