Bootstrap Tokenfield 与 Typeahead / Bloodhound 排除令牌

Posted 2023-05-07

【中文标题】Bootstrap Tokenfield 与 Typeahead / Bloodhound 排除令牌

【英文标题】：Bootstrap Tokenfield with Typeahead / Bloodhound exclude tokens

【发布时间】：2014-07-09 22:29:23

【问题描述】：

我正在使用带有 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();
    
  );
);

【参考方案1】：

更新了过滤功能，移除了已经在token字段中的用户：

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();
                
            );
        
    );

【讨论】：

当我使用此代码 url：API_URL + '?action=message_friends&q=%QUERY'，并将其作为已发布标题的一部分进行检查时，post 变量值为 %Query 而不是实际值。有什么问题？