select2如何显示数据

时间:2016-09-19 14:40:55

标签: symfony select2

我想在我的Symfony项目中使用select2,但仍然不知道如何显示结果。我的前端代码是

    $(".js_search").select2({
                ajax: {
                    url: "{{ path('search') }}",
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return {
                            q: params.term, // search term
                            page: params.page
                        };
                    },
                    processResults: function (data, params) {
                        console.log(data.items);
                        params.page = params.page || 1;

                        return {
                            results: data.items,
                            pagination: {
                                more: (params.page * 30) < data.total_count
                            }
                        };
                    },
                    cache: true
                },
                escapeMarkup: function (markup) {
                    return markup;
                }, // let our custom formatter work
                minimumInputLength: 1,
                templateResult: formatRepo, // omitted for brevity, see the source of this page
                templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
            });
        });
        function formatRepo (repo) {
            if (repo.loading) return repo.text;

            var markup = '<div class="clearfix">' +
                    '<div class="col-sm-1">' +
                    '<img src="' + repo.owner.avatar_url + '" style="max-width: 100%" />' +
                    '</div>' +
                    '<div clas="col-sm-10">' +
                    '<div class="clearfix">' +
                    '<div class="col-sm-6">' + repo.full_name + '</div>' +
                    '<div class="col-sm-3"><i class="fa fa-code-fork"></i> ' + repo.forks_count + '</div>' +
                    '<div class="col-sm-2"><i class="fa fa-star"></i> ' + repo.stargazers_count + '</div>' +
                    '</div>';

            if (repo.description) {
                markup += '<div>' + repo.description + '</div>';
            }
            markup += '</div></div>';
            return markup;
        }

        function formatRepoSelection (repo) {
            return repo.full_name || repo.text;
        }

克 而对于后端

    public function searchAction()
{
    $response = new Response();
    $response->setContent(json_encode(
        [
            'items' =>
                [
                    'id' => 1,
                    'text' => 'test'
                ]
        ]
    ));
    $response->headers->set('Content-Type', 'application/json');
    return $response;
}

我不知道$ response应该是什么样的,或者如何在视图中显示返回的数据。 有人知道答案吗?

我正在使用此https://select2.github.io/

1 个答案:

答案 0 :(得分:0)

您的响应应该是一个JSON数组,其中包含Select2用于为下拉列表创建选项标记的元素。

在您的情况下,您对AJAX请求的重新审核内容将是:

[{"id": 1, "text":"test"}]

然后,Select2将使用响应中的选项和值更新JQuery Selector $(。js-search)标识的元素。