CODEWITHSUNDEEP
jqueryjquery-select2
mark winkle
mark winkle

Reputation: 206

select2 can i show the default list of options in the select2 ajax call

How can i show the default list of options in the select2 ajax call plugin.

Before typing the characters i wanna to show atleast 10 options in the drop down list.

$(".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
                                }
                            })



                    };
                }
            }
            });

Upvotes: 4

Views: 6494

Answers (2)

Priyank
Priyank

Reputation: 1009

Set This Code in your jquery where ever you want to open select2,

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

You can add Default Options by Adding This Code, Make This Object,

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

Pass This Object as

$(".doctor_id_pat1").select2('data',DEFAULT_OPTIONS );

Upvotes: 0

Tharif
Tharif

Reputation: 13971

Select2 gives you a customizable select box with support for searching, tagging, remote data sets, infinite scrolling, and many other highly used options.

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 });
        }
    }
});

fiddled here

Upvotes: 4

Related Questions