Question

我正在使用带有typeahead / bloodhound的bootstrap-tokenfield。

我可以阻止在令牌字段中使用相同的令牌两次，但同样的令牌仍会出现在先行响应中。如何排除令牌字段中已有的令牌？

var engine = new Bloodhound({
  remote: {
    url: API_URL + '?action=message_friends&q=%QUERY',
    filter: function (response) {
      return $.map(response.users, function (user) {
        return {
          value: user.user_id,
          label: user.name
        };
      });
    }
  },
  datumTokenizer: function(d) {
    return Bloodhound.tokenizers.whitespace(d.value); 
  },
  queryTokenizer: Bloodhound.tokenizers.whitespace    
);

engine.initialize();

$('#to-tags').tokenfield({
  typeahead: [
    {
      hint: false
    }, 
    {
      name: 'users',
      displayKey: 'label',
      source: engine.ttAdapter()
    }
  ]
}).on('tokenfield:createtoken', function (event) {
  var existingTokens = $(this).tokenfield('getTokens');
  $.each(existingTokens, function(index, token) {
    if (token.value === event.attrs.value) {
      event.preventDefault();
    }
  });
});

Answer 1

更新了过滤器功能，以删除令牌字段中已有的用户：

var engine = new Bloodhound({
        remote: {
            url: API_URL + '?action=message_friends&q=%QUERY',
            filter: function (response) {
                var tagged_user = $('#to-tags').tokenfield('getTokens');
                return $.map(response.users, function (user) {
                    var exists = false;
                    for (i=0; i < tagged_user.length; i++) {
                        if (user.user_id == tagged_user[i].value) {
                            var exists = true;
                        }
                    }
                    if (!exists) {
                        return {
                            value: user.user_id,
                            label: user.name
                        };
                    }
                });
            }
        },
        datumTokenizer: function (d) {
            return Bloodhound.tokenizers.whitespace(d.value);
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace
    });

    engine.initialize();

    $('#to-tags').tokenfield({
        delimiter: false,
        typeahead: [
            {
                hint: false
            }, 
            {
                name: 'users',
                displayKey: 'label',
                source: engine.ttAdapter()
            }
        ]
    })
    .on('tokenfield:createtoken', function (e) {
        var existingTokens = $(this).tokenfield('getTokens');
        if (existingTokens.length) {
            $.each(existingTokens, function(index, token) {
                if (token.value === e.attrs.value) {
                    e.preventDefault();
                }
            });
        }
    });

具有Typeahead / Bloodhound的Bootstrap Tokenfield排除令牌

1 个答案: