Skip to content
This repository has been archived by the owner on Sep 10, 2023. It is now read-only.

Added the ability to exclude current tokens from the autocomplete #643

Merged
merged 2 commits into from
Mar 14, 2014
Merged

Added the ability to exclude current tokens from the autocomplete #643

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
88fe0a0
Added the ability to exclude current tokens from the autocomplete dro…
toneplex Mar 13, 2014
01885b0
renamed excludeCurrentParam to excludeCurrentParameter & other code c…
toneplex Mar 14, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 32 additions & 6 deletions demo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
</script>
</head>

<body>
<body style="margin-bottom: 200px;">
<h1>jQuery Tokeninput Demos</h1>

<h2>Simple Server-Backed Search</h2>
Expand Down Expand Up @@ -235,9 +235,9 @@ <h2 id="onadd-ondelete">Using onAdd and onDelete Callbacks</h2>

<h2 id="plugin-methods">Using the add, remove, clear and toggleDisabled Methods</h2>
<div>
<a href="#" id="plugin-methods-add">Add Token</a> |
<a href="#" id="plugin-methods-remove">Remove Token</a> |
<a href="#" id="plugin-methods-clear">Clear Tokens</a> |
<a href="#" id="plugin-methods-add">Add Token</a> |
<a href="#" id="plugin-methods-remove">Remove Token</a> |
<a href="#" id="plugin-methods-clear">Clear Tokens</a> |
<a href="#" id="plugin-methods-toggle-disable">Toggle Disabled</a><br />
<input type="text" id="demo-input-plugin-methods" name="blah" />
<input type="button" value="Submit" />
Expand Down Expand Up @@ -272,7 +272,7 @@ <h2 id="plugin-methods">Using the add, remove, clear and toggleDisabled Methods<
});
</script>
</div>

<h2>Local Data Search with custom propertyToSearch, resultsFormatter and tokenFormatter</h2>
<div>
<input type="text" id="demo-input-local-custom-formatters" name="blah" />
Expand Down Expand Up @@ -674,7 +674,7 @@ <h2>Change propertyToSearch anytime</h2>
});
</script>
</div>

<h2>Start disabled</h2>
<div>
<input type="text" id="demo-input-disabled" name="blah" />
Expand Down Expand Up @@ -720,5 +720,31 @@ <h2>Free Tagging</h2>
</script>
</div>

<h2>Exclude Current Tokens From Autocomplete</h2>
<div>
<input type="text" id="demo-input-local-exclude" name="blah" />
<input type="button" value="Submit" />
<script type="text/javascript">
$(document).ready(function() {
$("#demo-input-local-exclude").tokenInput([
{id: 7, name: "Ruby"},
{id: 11, name: "Python"},
{id: 13, name: "JavaScript"},
{id: 17, name: "ActionScript"},
{id: 19, name: "Scheme"},
{id: 23, name: "Lisp"},
{id: 29, name: "C#"},
{id: 31, name: "Fortran"},
{id: 37, name: "Visual Basic"},
{id: 41, name: "C"},
{id: 43, name: "C++"},
{id: 47, name: "Java"}
], {
excludeCurrent: true
});
});
</script>
</div>

</body>
</html>
51 changes: 48 additions & 3 deletions src/jquery.tokeninput.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ var DEFAULT_SETTINGS = {
propertyToSearch: "name",
jsonContainer: null,
contentType: "json",
excludeCurrent: false,
excludeCurrentParameter: "x",

// Prepopulation settings
prePopulate: null,
Expand Down Expand Up @@ -839,8 +841,37 @@ $.TokenList = function (input, url_or_data, settings) {
return template.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + regexp_escape(value) + ")(?![^<>]*>)(?![^&;]+;)", "g"), highlight_term(value, term));
}

// exclude existing tokens from dropdown, so the list is clearer
function excludeCurrent(results) {
if ($(input).data("settings").excludeCurrent) {
var currentTokens = $(input).data("tokenInputObject").getTokens(),
trimmedList = [];
if (currentTokens.length) {
$.each(results, function(index, value) {
var notFound = true;
$.each(currentTokens, function(cIndex, cValue) {
if (value[$(input).data("settings").propertyToSearch] == cValue[$(input).data("settings").propertyToSearch]) {
notFound = false;
return false;
}
});

if (notFound) {
trimmedList.push(value);
}
});
results = trimmedList;
}
}

return results;
}

// Populate the results dropdown with some results
function populate_dropdown (query, results) {
// exclude current tokens if configured
results = excludeCurrent(results);

if(results && results.length) {
dropdown.empty();
var dropdown_ul = $("<ul/>")
Expand Down Expand Up @@ -939,7 +970,7 @@ $.TokenList = function (input, url_or_data, settings) {
function run_search(query) {
var cache_key = query + computeURL();
var cached_results = cache.get(cache_key);
if(cached_results) {
if (cached_results) {
if ($.isFunction($(input).data("settings").onCachedResult)) {
cached_results = $(input).data("settings").onCachedResult.call(hidden_input, cached_results);
}
Expand All @@ -948,7 +979,7 @@ $.TokenList = function (input, url_or_data, settings) {
// Are we doing an ajax search or local data search?
if($(input).data("settings").url) {
var url = computeURL();
// Extract exisiting get params
// Extract existing get params
var ajax_params = {};
ajax_params.data = {};
if(url.indexOf("?") > -1) {
Expand All @@ -968,10 +999,24 @@ $.TokenList = function (input, url_or_data, settings) {
ajax_params.data[$(input).data("settings").queryParam] = query;
ajax_params.type = $(input).data("settings").method;
ajax_params.dataType = $(input).data("settings").contentType;
if($(input).data("settings").crossDomain) {
if ($(input).data("settings").crossDomain) {
ajax_params.dataType = "jsonp";
}

// exclude current tokens?
// send exclude list to the server, so it can also exclude existing tokens
if ($(input).data("settings").excludeCurrent) {
var currentTokens = $(input).data("tokenInputObject").getTokens();
var tokenList = $.map(currentTokens, function (el) {
if(typeof $(input).data("settings").tokenValue == 'function')
return $(input).data("settings").tokenValue.call(this, el);

return el[$(input).data("settings").tokenValue];
});

ajax_params.data[$(input).data("settings").excludeCurrentParameter] = tokenList.join($(input).data("settings").tokenDelimiter);
}

// Attach the success callback
ajax_params.success = function(results) {
cache.add(cache_key, $(input).data("settings").jsonContainer ? results[$(input).data("settings").jsonContainer] : results);
Expand Down