Bootstrap标签输入,根据ajax调用将类分配给标签

时间:2016-12-07 19:18:54

标签: javascript jquery bootstrap-tags-input

Bootstrap Tags Input Plugin中,我可以通过tagClass属性为每个标签指定不同的颜色。但是我希望通过asynchronus ajax调用来完成这项工作。

简而言之,我想要默认颜色,验证成功颜色和验证失败颜色。

当我进行同步jQuery.ajax调用时,它工作正常(如代码所示),但我无法将async设置为true。

var elt = $('#multiple');
elt.tagsinput({
  maxTags: 7,
  trimValue: true,
  tagClass: function(item) {
    var val = $.ajax({
  url: 'http://localhost/reg/candidate/?id='.concat(item),
  dataType: 'json',
  async: false,
});

if (val.status==200){
  console.log(val)
  if((val.responseJSON).resp){
      return 'label label-success';
  }
}


return 'label label-danger';

  },
  confirmKeys: [13, 44,32, 188]
});

我不想使用预取,因为服务器上可能存在大量数据项。

编辑:我找到了一种实现目标的黑客方法。但我想知道任何好的选择。

elt.on('itemAdded', function(event) {
$.ajax({
  url: 'http://localhost/reg/candidate/?id='.concat(event.item),
  dataType: 'json',
  //async: false,
  success: function(data){
      $("span.tag:contains("+event.item+")").removeClass("label-info",1000,"easeInBack");
    if(data.resp){
    $("span.tag:contains("+event.item+")").addClass('label-success');
    }
    else{
      $("span.tag:contains("+event.item+")").addClass('label-danger');
    }
  }
});
});

0 个答案:

没有答案