Question

我正在尝试使用带有Yii2搜索模型的jquery-select2（加载远程数据）插件。截至目前，我的控制器返回从搜索模型创建的$ dataProvider。但是，它显然不是select2可用于创建下拉列表的格式。

我需要对$ dataProvider或select2做什么才能让两者一起工作？

我看到的方式有两种选择：

从$ dataProvider中提取'cat_name'并将其放入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
  }); 
});

Answer 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,
  });   
});

Answer 2

尝试从模型中提取所需的列

 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); 

   }
}

如何在select2中使用ActiveDataProvider？

2 个答案: