Xeditable Select2 Ajax Call Not Working Properly

Viewed 590

I try to build Xeditable Select2 Ajax Multiple Select Options but I got following error in console.

My Select2 version is 4.0.3 My Xeditable version is 1.5.1

Error:

jQuery.Deferred exception: Cannot read property 'slice' of undefined TypeError: Cannot read property 'slice' of undefined
    at d.a.removePlaceholder (http://www.aa.lk/js/select2.min.js:2:10575)
    at d.j [as removePlaceholder] (http://www.aa.lk/js/select2.min.js:1:4456)
    at d.a.append (http://www.aa.lk/js/select2.min.js:2:10380)
    at d.j [as append] (http://www.aa.lk/js/select2.min.js:1:4456)
    at e.<anonymous> (http://www.aa.lk/js/select2.min.js:1:9378)
    at e.d.invoke (http://www.aa.lk/js/select2.min.js:1:5094)
    at e.d.trigger (http://www.aa.lk/js/select2.min.js:1:4913)
    at e.trigger (http://www.aa.lk/js/select2.min.js:2:29479)
    at http://www.aa.lk/js/select2.min.js:2:27951
    at Object.f.transport.d.status.0.d.status.e.trigger.message (http://www.aa.lk/js/select2.min.js:2:4227) undefined 

Javascript Code:

$.fn.editable.defaults.mode = 'inline';
$('#country').editable({
    select2: {

            placeholder: 'Select a Requester',
            multiple: true,

        id: function (item) {
            return item.id;
        },
            ajax: {
                url: '/php/friendtag.php',
                dataType: 'json',
                data: function (term, page) {
                    return { query: term };
                },
                results: function (data, page) {
                    return { results: data };
                }
            },
        templateResult: function (item) {
            return item.text;
        },
        templateSelection : function (item) {
            return item.text;
        },
            current: function (item, callback) {
                return $.get('/php/friendtag.php', { query: item.val() }, function (data) {
                    callback(data);
                }, 'json'); //added dataType
            }


    },
    tpl:'<select multiple="multiple"></select>',
    emptytext: 'Empty Friends'
});

HTML Code:

<a href="#" id="country" data-type="select2" data-pk="1" data-value="ru" data-url="" data-title="Select country" data-inputclass="aa"></a>

How to solve this problem?

This is Ajax Result:

[{"id":"5","text":"dvd"},{"id":"2","text":"aa"},{"id":"3","text":"bb"},{"id":"6","text":"dd"}]
0 Answers
Related