yii2使用select2,将搜索的数据分页加载

//这是model层
 public static function getUsersByKeywords ($page,$q,$offset)
    {
        $query = new Query();
        $query ->select([
            'u.user_id',
            'u.user_name'
        ])->from([
            'u' => User::tableName()
        ]);
        if (!empty($q)) {
            $query->andWhere(['like','u.user_name',$q]);
        }
        $total_count = $query->count();
        $pagination = new Pagination(['totalCount' => $total_count, 'page' => $page-1,'pageSize'=>$offset]);
        $list =  $query
            ->offset($pagination->offset)
            ->limit($pagination->limit)
            ->orderBy('user_id asc')
            ->all();
        $users = $list;
        $data['users'] = $users;
        $data['total_count'] = $total_count;
        return $data;
    }
//这是控制器层
public function actionGetUsersByKeywords()
    {
        $page = Filter::get('page',1);//当前页
        $q = Filter::get('q'.'');//关键字
        $offset =  Filter::get('offset',6);//每页显示条数
        $data = shop::getUsersByKeywords($page,$q,$offset);
        return Result::success([
            'res' =>$data['users'],
            'total' => $data['total_count'],
        ])->toJson();
    }
//这是html使用了模板引擎的,加个class就行了
{fieldtemplate model=$model field='user_id'}
    {input type='select' class='js-data-example-ajax' model=$model field='user_id' items=$users}
{/fieldtemplate}
//这是js
{script src='@static/js/select2/select2.min.js'}
<script type="text/javascript">
        $('.js-data-example-ajax').select2({
            placeholder:  '--请选择--',
            ajax: {
                url: "/shop/shop/get-users-by-keywords",
                dataType: 'json',
                delay: 250,
                data: function (params) {
                    params.offset = 6;
                    return {
                        q: params.term,
                        page: params.page,
                        offset:params.offset
                    };
                },
                processResults: function (data, params) {
                    params.page = params.page || 1;
                    var users = data.res || [];
                    var options = [];
                    for (var i = 0, len = users.length; i < len; i++) {
                        var option = {
                            "id": users[i]["user_id"],
                            "text": users[i]["user_name"]
                        };
                        options.push(option);
                    }

                    return {
                        results: options,
                        pagination: {
                            more: (params.page * params.offset) < data.total
                        }
                    };
                },
                cache: true
            },
            escapeMarkup: function (markup) { return markup; },
            //minimumInputLength: 1
        });
</script>
//引入css
{link href="@static/css/select2/select2.min.css"}






评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值