自动完成与Bootstrap标签输入与typeahead和ajax无法正常工作

时间:2017-03-21 23:53:34

标签: jquery ajax twitter-bootstrap bootstrap-tags-input

我尝试将bootstrap tagsinputtypeahead和ajax一起使用,以便在HTML输入上使用自动填充功能。我之前包含了所有必需的文件(tagsinput和typeahead js)。

HTML

<input type="text"  id="level" value="" class="form-control" placeholder="Choissez les niveaux" name="levels">

JQuery

$('#level').tagsinput({
  typeaheadjs: {
      source: function (query, process) {
            var $items = new Array;
            $items = [""];

            $.ajax({

              url: '/posts/levels/',
              dataType: 'json',
              type: "GET",
              data: {
                  name_startsWith: query
              },
              success: function (data) {
                  $.map(data, function(data){
                    var group;
                    group = {
                        name: data.name,
                        toString: function () {
                            return JSON.stringify(this);
                            //return this.app;
                        },
                        toLowerCase: function () {
                            return this.name.toLowerCase();
                        },
                        indexOf: function (string) {
                            return String.prototype.indexOf.apply(this.name, arguments);
                        },
                        replace: function (string) {
                            var value = '';
                            value +=  this.name;
                            if(typeof(this.level) != 'undefined') {
                                value += ' <span class="pull-right muted">';
                                value += this.level;
                                value += '</span>';
                            }
                            return String.prototype.replace.apply('<div style="padding: 10px; font-size: 1.5em;">' + value + '</div>', arguments);
                        }
                    };
                    $items.push(group);
                });
                process($items);
              }

          });

      },
      property: 'name',
      updater: function (item) {
        var item = JSON.parse(item);
        console.log(item.name);
        return item.name;
    }
  }
});

我从这里拿到了这个:link这应该有效。

这不起作用。实际上,请求被发送到正确回答的服务器。然后$ items等于{&#39; name&#39;:&#39; theName&#39;},但是process($ items)不会执行任何操作。

0 个答案:

没有答案