Question

如何在select2 ajax调用插件中显示默认的选项列表。

在输入字符之前，我想在下拉列表中显示至少10个选项。

$(".doctor_id_pat1").select2({
            placeholder: "Search Users",
            minimumInputLength: 0,
            ajax: {
                url: "test.php",
                dataType: 'json',
                data: function (term) {
                    return {
                        q: term
                    };
                },
                results: function (data, page) {

                    console.log(data);

                    return { 

                            results: $.map(data, function (item) {
                                return {
                                    text: item.text,
                                    id: item.id
                                }
                            })



                    };
                }
            }
            });

Answer 1

Select2 为您提供了一个可自定义的选择框，支持搜索，标记，远程数据集，无限滚动以及许多其他高度使用的选项。

HTML

<input type="hidden" id="select" value="" style="width:300px;" /><br />

JAVASCRIPT

var DEFAULT_OPTIONS = [
    { id: 'def1', text: 'Default Choice 1' },
   //your options goes here
];

var AJAX_OPTIONS = [
    { id: '1', text: 'Choice 1' },
  //your options goes here
];

var lastOptions = DEFAULT_OPTIONS;

$('#select').select2({
    minimumInputLength: 0,
    query: function(options) {
        if (options.term) {
            $.ajax({
                type: 'post',
                url: '/echo/json/',
                dataType: 'json',
                data: {
                    json: JSON.stringify(AJAX_OPTIONS),
                    delay: 0.3
                },
                success: function(data) {
                    lastOptions = data;
                    options.callback({ results: data });
                }
           });
        } else {
            options.callback({ results: lastOptions });
        }
    }
});

摆弄here

Answer 2

在您的jquery中设置此代码，您可以在其中打开select2，

$(".doctor_id_pat1").select2('open');

您可以通过添加此代码添加默认选项，制作此对象，

var DEFAULT_OPTIONS = [
    { id: 'def1', text: 'Default Choice 1' },
   //your options goes here
];

将此对象传递为

$（＆＃34; .doctor_id_pat1＆＃34;）。select2（＆＃39; data＆＃39;，DEFAULT_OPTIONS）;

select2可以在select2 ajax调用中显示默认的选项列表

2 个答案: