Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
9b59ec1
Mootools 1.3 compatibility and code style improvement
czukowski Feb 16, 2011
7071598
Added GrowingInput
czukowski Feb 16, 2011
b0092d4
Reordered class methods alphabetically
czukowski Feb 17, 2011
12cd5f3
CSS code style and minor improvement
czukowski Feb 17, 2011
bc11d29
CSS code style
czukowski Feb 17, 2011
6c11f46
More JS code styling
czukowski Feb 17, 2011
f8a3a42
More fixes
czukowski Feb 17, 2011
10a0d26
More code styling
czukowski Feb 17, 2011
8e96bf7
Autocomplete showResults filter fix, added custom filter option
czukowski Feb 17, 2011
5a6e6b4
Typo fix in focusRelated
czukowski Feb 17, 2011
9f45574
Box shadow changed from solid color to rgba()
czukowski Feb 17, 2011
24f33d8
Don't set dropdown placeholder width when container width determined …
czukowski Mar 8, 2011
49f0e09
Updated demo
czukowski Mar 10, 2011
7b6a6a4
Typo fix
czukowski Mar 10, 2011
a9bb587
Autocomplete fires 'request' and 'response' events on textboxlist
czukowski Mar 11, 2011
54234db
Autocomplete plugin: 'No matches' displayed on empty server response
czukowski Mar 14, 2011
183092c
Migrated to MooTools 1.4
Sep 21, 2011
257ade6
Fix autocomplete that displayed only one result
yannickcr Oct 12, 2011
ab44ab1
If deletebutton is clicked preventDefault to not trigger a hash chang…
leon Nov 7, 2011
500a52c
Made compatible with event.code
Dec 20, 2011
dabe39c
Updated to MooTools 1.4.2
Dec 20, 2011
fc0c34f
Cleanup
Dec 20, 2011
e216b1d
Fixed bug with autocomplete plugin setting options causing bit option…
Dec 20, 2011
d9edc0b
Merge pull request #1 from leon/master
yannickcr Jan 2, 2012
970b0fc
Merge pull request #1 from Country/master
Jan 4, 2012
90a1428
Updated to MooTools 1.4.3
Jan 26, 2012
3bdf2a5
Cleanup
Jan 26, 2012
940a61d
Enter event on textboxlist was firing before autocomplete plugin coul…
Jan 26, 2012
60bebb3
Merge branch 'master' of github.com:leon/TextboxList
Jan 26, 2012
34ce636
add option "showAllValues" to the autocomplete plugin
frozeman Jul 18, 2012
43026e9
small fix
frozeman Jul 18, 2012
4c35879
add reAddValues option, tags which removed will appear again in the a…
frozeman Jul 19, 2012
9f384a1
made it possible to edit existing bits with double click
frozeman Oct 2, 2012
922a0b7
you can now edit the tags with "enter"
frozeman Oct 6, 2012
601c75c
small fix in the selection after created a tag
frozeman Oct 31, 2012
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
79 changes: 0 additions & 79 deletions Demo/GrowingInput.js

This file was deleted.

36 changes: 23 additions & 13 deletions Demo/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,42 +12,52 @@
<!-- required stylesheet for TextboxList.Autocomplete -->
<link rel="stylesheet" href="../Source/TextboxList.Autocomplete.css" type="text/css" media="screen" charset="utf-8" />

<script src="mootools-1.2.1-core-yc.js" type="text/javascript" charset="utf-8"></script>

<!-- required for TextboxList -->
<script src="GrowingInput.js" type="text/javascript" charset="utf-8"></script>
<script src="mootools-core-1.4.3.js" type="text/javascript" charset="utf-8"></script>

<script src="../Source/TextboxList.js" type="text/javascript" charset="utf-8"></script>
<script src="../Source/TextboxList.js" type="text/javascript" charset="utf-8"></script>
<script src="../Source/TextboxList.Autocomplete.js" type="text/javascript" charset="utf-8"></script>
<!-- required for TextboxList.Autocomplete if method set to 'binary' -->
<script src="../Source/TextboxList.Autocomplete.Binary.js" type="text/javascript" charset="utf-8"></script>
<script src="../Source/TextboxList.Autocomplete.Binary.js" type="text/javascript" charset="utf-8"></script>

<!-- sample initialization -->
<script type="text/javascript" charset="utf-8">
<script type="text/javascript" charset="utf-8">
window.addEvent('load', function(){
// Standard initialization
var t = new TextboxList('form_tags_input', { });
t.add('Tag 1').add('Tag 2').add('Tag 3');

// With custom adding keys
var t2 = new TextboxList('form_tags_input_2', {bitsOptions:{editable:{addKeys: 188}}});
var t2 = new TextboxList('form_tags_input_2', {bitsOptions:{editable:{addKeys: [188, 32]}}});
t2.add('Tag 1').add('Tag 2');

// Autocomplete initialization
var t4 = new TextboxList('form_tags_input_3', {unique: true, plugins: {autocomplete: {}}});
var t4 = new TextboxList('form_tags_input_3', {
unique: true,
bitsOptions: {
editable: {
addOnBlur: true,
stopEnter: true,
addKeys: [188, 32, 13]
}
},
plugins: {
autocomplete: {}
}
});
t4.add('John Doe').add('Jane Roe');
t4.plugins['autocomplete'].setValues([["Mr Dude", "Mr Dude"],["A Girl", "A Girl"],["Boy", "Boy"]]);

// sample data loading with json, but can be jsonp, local, etc.
// the only requirement is that you call setValues with an array of this format:
// [
// [id, bit_plaintext (on which search is performed), bit_html (optional, otherwise plain_text is used), autocomplete_html (html for the item displayed in the autocomplete suggestions dropdown)]
// ]
// read autocomplete.php for a JSON response exmaple
t4.container.addClass('textboxlist-loading');
t4.container.addClass('textboxlist-loading');
new Request.JSON({url: 'autocomplete.php', onSuccess: function(r){
t4.plugins['autocomplete'].setValues(r);
t4.container.removeClass('textboxlist-loading');
}}).send();
}}).send();

// Autocomplete with poll the server as you type
var t5 = new TextboxList('form_tags_input_4', {unique: true, plugins: {autocomplete: {
Expand All @@ -69,7 +79,7 @@

/* Preloader for autocomplete */
.textboxlist-loading { background: url('images/spinner.gif') no-repeat 380px center; }

/* Autocomplete results styling */
.form_friends .textboxlist-autocomplete-result { overflow: hidden; zoom: 1; }
.form_friends .textboxlist-autocomplete-result img { float: left; padding-right: 10px; }
Expand All @@ -88,7 +98,7 @@ <h2>TextboxList (standard)</h2>
<div class="form_tags"><input type="text" name="test" value="" id="form_tags_input" /></div>
<p class="note">Type the tag (one or more words) and press enter. Use left/right arrows, backspace, delete to navigate</p>

<p>Enter tags (with commas)</p>
<p>Enter tags (with commas or space)</p>
<div class="form_tags"><input type="text" name="test2" value="" id="form_tags_input_2" /></div>
<p class="note">Type the tag (one or more words) and press comma (,). Use left/right arrows, backspace, delete to navigate</p>

Expand Down
Loading