我正在研究库存管理系统,有大量的产品和客户想在Select2小部件中显示产品,就像kartik小部件一样,他想在向下滚动时越来越多地表示数据,是否可用或者可以使用这个小部件完成或我必须创建自己的?这是我的代码
<?php
$url = Url::to ( [ 'products-list' ] );
echo Select2::widget ( [
'name' => 'state_10' ,
'options' => [
'id' => 'select_product' ,
'placeholder' => 'Select Product...' ,
'multiple' => false ,
'class' => ''
] ,
'pluginOptions' => [
'allowClear' => true ,
'minimumInputLength' => 1 ,
'ajax' => [
'url' => $url ,
'dataType' => 'json' ,
'data' => new JsExpression ( 'function(params) { return {q:params.term}; }' )
] ,
'escapeMarkup' => new JsExpression ( 'function (markup) { return markup; }' ) ,
'templateResult' => new JsExpression ( 'function(product) { console.log(product);return product.text; }' ) ,
'templateSelection' => new JsExpression ( 'function (subject) { return subject.text; }' ) ,
] ,
] );
?>
我在我的控制器中有这个动作,并且每件事情都运行良好但是我需要从在select2中显示多个产品开始,然后当滚动开始变得越来越多时
控制器动作:
public function actionProductsList($q = null, $id = null) {
Yii::$app->response->format = Response::FORMAT_JSON;
$out = ['results' => ['id' => '', 'text' => '', 'qtyLeft' => '', 'serialNumbers' => '']];
if (!is_null($q)) {
$query = new Query;
$query->select(['product_id as id', new Expression("CONCAT(product_name,' -- ',product_qty_left) AS text, product_qty_left as qtyLeft, s.serial_number as serialNumbers")])
->from('product')
->join('LEFT JOIN', 'serial_number s', 's.r_product_id = product.product_id')
->where(['like', 'product_name', $q]);
// ->limit(20);
$command = $query->createCommand();
$data = $command->queryAll();
$out['results'] = array_values($data);
} elseif ($id > 0) {
$out['results'] = ['id' => $id, 'text' => AppProduct::find()->where(['product_id' => $id])->one()->product_name];
}
return $out;
}
根据使用分页的文档,您必须通过覆盖ajax.data
设置告诉Select2将任何必要的分页参数添加到请求中。要检索的当前页面存储在params.page
属性中。
所以你需要将Select2
更改为以下内容
$url = Url::to ( [ 'products-list' ] );
echo Select2::widget ( [
'name' => 'state_10' ,
'options' => [
'id' => 'select_product' ,
'placeholder' => 'Select Product...' ,
'multiple' => false ,
'class' => ''
] ,
'pluginOptions' => [
'allowClear' => true ,
'minimumInputLength' => 1 ,
'ajax' => [
'url' => $url ,
'dataType' => 'json' ,
'data' => new JsExpression ( 'function(params) { return {q:params.term, page:params.page || 1}; }' )
] ,
'escapeMarkup' => new JsExpression ( 'function (markup) { return markup; }' ) ,
'templateResult' => new JsExpression ( 'function(product) { console.log(product);return product.text; }' ) ,
'templateSelection' => new JsExpression ( 'function (subject) { return subject.text; }' ) ,
] ,
] );
Select2将在响应中期望pagination.more
值。更多的值应该是true
或false
,它告诉Select2是否有更多的结果页面可用于检索:
{
"results": [
{
"id": 1,
"text": "Option 1"
},
{
"id": 2,
"text": "Option 2"
}
],
"pagination": {
"more": true
}
}
因此,修改服务器端代码以包含$page
参数,并在查询中包含limit
和offset
。我正在使用5条记录作为限制,你可以改变它。
public function actionProductsList($page, $q = null , $id = null ) {
$limit=5;
$offset=($page-1)*$limit;
Yii::$app->response->format = Response::FORMAT_JSON;
$out = [ 'results' => [ 'id' => '' , 'text' => '' , 'qtyLeft' => '' , 'serialNumbers' => '' ] ];
if ( !is_null ( $q ) ) {
$query = new \yii\db\Query;
$query->select ( [ 'product_id as id' , new Expression ( "CONCAT(product_name,' -- ',product_qty_left) AS text, product_qty_left as qtyLeft, s.serial_number as serialNumbers" ) ] )
->from ( 'product' )
->join ( 'LEFT JOIN' , 'serial_number s' , 's.r_product_id = product.product_id' )
->where ( [ 'like' , 'product_name' , $q ] )
->offset ( $offset )
->limit ( $limit );
$command = $query->createCommand ();
$data = $command->queryAll ();
$out['results'] = array_values ( $data );
$out['pagination'] = [ 'more' => !empty($data)?true:false ];
} elseif ( $id > 0 ) {
$out['results'] = [ 'id' => $id , 'text' => AppProduct::find ()->where ( [ 'product_id' => $id ] )->one ()->product_name ];
}
return $out;
}
Update
我在上面的代码中找到了一些修改并进行了更改
$offset=($page-1)*$limit;
而不是使用像$page
这样的->offset($page)
使用像$offset
这样的->offset($offset)
。$out['pagination'] = [ 'more' => !empty($data)?true:false ];