如何在select2中使用ActiveDataProvider？

Question

我想用Yii2搜索模型使用jquery-select2（加載遠程數據）插件。截至目前，我的控制器返回從搜索模型創建的$ dataProvider。但是，它顯然不是select2可用來創建下拉列表的格式。

對於$ dataProvider或select2來說，我需要做什麼才能讓兩者一起工作？

我看到它的方式，有2個選項：

1. 提取從$ dataProvider中的「cat_name」，並把它放在選擇2可以使用的格式。
2. 示教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); 

    } 
}