1

下面的exp为我工作，

$('#casecustomtag').bstagsinput({
    typeahead: {
        displayText: function (text) {
            return text;
        },
        source: function (query, response) {
            return ['Business and industry', 'Economics and finance', 'Education and skills', 'Employment, jobs and careers', 'Environment', 'Government, politics and public administration', 'Health, well-being and care', 'Housing', 'Information and communication', 'International affairs and defence', 'Leisure and culture', 'Life inthe community', 'People and organisations', 'Public order, justice and rights', 'Science, technology and innovation', 'Transport and infrastructure']
        },
        minLength: 2
    },
    addOnBlur: true,
    freeInput: true,
    confirmKeys: [13],
    splitOn: null,
    writerWidth: 'auto'
});

但是当我尝试 ajax 调用时，我看不到这个建议。不过，我的服务器得到了正确的响应。 

$('#casecustomtag').bstagsinput({
   typeahead: {
       displayText: function (text) {
           return text;
       },
       source: function (query, response) {
           return $.get('/ajax/customtags/gettags', {
               search: query,
               userId: 1
           }, function (data) {
               console.log(data);
               response =  $.map(data.data, function (item) {
                   console.log(item.text);
                   return item.text;                         
               });
               return response;
           }, 'json');
       },
       minLength: 2
   },
   addOnBlur: true,
   freeInput: true,
   confirmKeys: [13],
   splitOn: null,
   writerWidth: 'auto'
);

我正在使用 Bootstrap 3 供您参考，因为 iIt 与其他 jquery 插件冲突，所以我刚刚重命名tagsinput为。bstagsinput

拜托，有人帮我如何通过 ajax 动态显示建议吗？（我浪费了一整天的时间寻找解决方案，但对我没有任何用处。

4

2 回答 2

1

在浪费了一整天和代码调试之后，我找到了解决方案。

source: function (query, process) {
                    return $.get('/ajax/customtags/gettags', { search: query, userId: 1 },
                        function (data) {});
                },

我注意到需要完成回调部分是由插件自己处理的。我在插件中的现有代码下方找到了它。

source: function (query, process) {
                        function processItems(items) {
                            var texts = [];
                            for (var i = 0; i < items.length; i++) {
                                var text = self.options.itemText(items[i]);
                                map[text] = items[i];
                                texts.push(text);
                            }
                            process(texts);
                        }

                        this.map = {};
                        var map = this.map,
                            data = typeahead.source(query);

                        if ($.isFunction(data.success)) {
                            // support for Angular callbacks
                            data.success(processItems);
                        } else if ($.isFunction(data.then)) {
                            // support for Angular promises
                            data.then(processItems);
                        } else {
                            // support for functions and jquery promises
                            $.when(data)
                             .then(processItems);
                        }
                    },
于 2016-10-14T06:53:58.463 回答
1

从内存中，响应参数是您需要使用返回的数据调用的函数，但您正在覆盖它。您应该在 ajax 调用的成功回调中调用响应函数。

source: function (query, response) {
    return $.get('/ajax/customtags/gettags', {
        search: query,
        userId: 1
        }, function (data) {
             console.log(data);
             var result =  $.map(data.data, function (item) {
                  console.log(item.text);
                  item.text                            
             });
             response(result);
    }, 'json');
},
于 2016-10-13T15:52:56.723 回答