我正在使用带有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();
}
});
});
Run Code Online (Sandbox Code Playgroud) bootstrap-typeahead typeahead.js bloodhound bootstrap-tokenfield
我试图用Jquery Ui自动完成实现Bootstrap Tokenfield, 到目前为止我能够做到这一点,除了我无法防止输入字段中的重复,所以,不幸的是我的用户可以选择相同的值两次.
在我的搜索中,我发现Bootstrap Tokenfield有一种防止重复的方法.但是我不知道如何应用于我的代码,因为它在我看来它与Twitter typeahead而不是Jquery Ui.
如何使用Jquery Ui自动完成功能防止使用Bootstrap TokenField重复?
这是我的基于jquery ui自动完成的Bootstrap TokenField代码
$('.tokenfield').tokenfield({
autocomplete: {
source: [
{
"id": "1",
"value": "Ferdine Faithfull"
},
{
"id": "2",
"value": "John Carta"
},
{
"id": "3",
"value": "Mezane Smith"
}
],
delay: 100
},
showAutocompleteOnFocus: true
});
Run Code Online (Sandbox Code Playgroud)
以下是我在Github上发现的防止重复虽然我认为它适用于Typeahead
$('#my-tokenfield').on('tokenfield:createtoken', function (event) {
var existingTokens = $(this).tokenfield('getTokens');
$.each(existingTokens, function(index, token) {
if (token.value === event.attrs.value)
event.preventDefault();
});
});
Run Code Online (Sandbox Code Playgroud) jquery-ui-autocomplete twitter-bootstrap bootstrap-tokenfield