刚开始使用yii,需要实现下拉多选搜索,就找到了select2这个组件,先看看实现后的效果:

如何安装select2网上有很详细的教程,这里不做赘述。
完成后只需要在视图文件use kartik\select2\Select2就可以了。
具体的视图中的代码如下:
<?=
$form->field($model, 'search')->widget(Select2::classname(), [
'options' => ['placeholder' => '请输入用户ID ...'],
'pluginOptions' => [
'id' => new JsExpression("function(rs) {
return rs.taskId;
}"),
'placeholder' => 'search ...',
'multiple' => true,
'allowClear' => true,
'language' => [
'errorLoading' => new JsExpression("function () { return 'Waiting...'; }"),
],
'ajax' => [
'url' => Url::to(['gm-account-info/search-title']),
'dataType' => 'json',
'data' => new JsExpression('function(params) {
return {q:params.term}; }')
],
'escapeMarkup' => new JsExpression('function (markup) {
return markup; }'),
'templateResult' => new JsExpression('function(res) {
return res.text; }'),
'templateSelection' => new JsExpression('function (res) {
return res.text; }'),
],
]);
?>控制器中代码如下:
$out = ['results' => ['userid' => '', 'text' => '']];
if (!$q) {
echo json_encode($out);die;
}
$data = GmAccountInfo::find()
->select('uid as userid, account_name as text')
->andFilterWhere(['like', 'uid', $q])
->asArray()
->all();
$out['results'] = array_values($data);
echo json_encode($out);die;这样出来的结果是这样的:

搜索结果是下拉显示出来了,但是无法选中。 
最后将控制器中的代码做了一点修改:
$out = ['results' => ['id' => '', 'text' => '']];
if (!$q) {
echo json_encode($out);die;
}
$data = GmAccountInfo::find()
->select('uid as id, uid as text') //userid=>id
->andFilterWhere(['like', 'uid', $q])
->asArray()
->all();
$out['results'] = array_values($data);
echo json_encode($out);die;将返回数据的格式调整为[‘id’=>”,’text’=>],就正常了。
结论:使用select2 组件时,后端返回的数据格式必须是[‘id’=>”,’text’=>]这个格式的。
版权声明:本文为jxh_smile99原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。