TextboxList 0.3 and jQuery version out!
Moo TextboxList 0.3 changes:
- HTML for bits not showing properly fixed
highlightSelectornot working (due to a typo) fixedGrowingInputmissing pad function added (only affected if you customized growing.mini option)- Improved clicking the whole widget behavior
- Other tiny enhancements / cleanup
Secondly, in the best interest of the JavaScript community, I’ve ported TextboxList to jQuery. The API changes slightly due to the different OOP approach, but all the functionality is intact. Head to jQuery TextboxList project page for more.
Update: 0.2 is out for jQuery. Bugs in autocompleter and IE have been addressed.
-
Sunday 8 months ago
Please how do i make the textboxlist empty onload
-
Richard denise 10 months ago
Thanks for this great thing..
I have a simple problem, when I type something, and if I click the submit button before pressing enter button, the value I just entered is not sent to the server.
How can I solve that? I’ll appreciate any help.
Regards
-
dodolwoi 11 months ago
Hello,
thanks for this great textboxlist.
But I have a problem, I need to take the values of the tags when somebody entered. And another thing when you typed “es” and before enclosing it with blue div, if you post the data, you cannot get the “es” value. How can I fix it?Thanks
-
alicia 11 months ago
is somebody reading the comments?
-
alicia 12 months ago
Hello,
thanks for this great textboxlist.
But I have a problem, I need to take the values of the tags when somebody entered. And another thing when you typed “es” and before enclosing it with blue div, if you post the data, you cannot get the “es” value. How can I fix it?Thanks
-
В офисе так нудно было, хорошо что нашел ваш сайт. Читаю с интересом:)
-
Точно, я с подобным тоже сталкивался
-
Gavin about 1 year ago
Hi all,
I’ve come across a few problems that I was hoping someone could help with.
1) There seems to be a rendering issue when using multiple instances of the TextboxList with the AutoComplete plugin enabled. The first instance works fine but all the others have a width of 0, which makes if difficult to select one of the results.
2) When running jQuery in noConflict mode, In was getting error messages. To get around this I changedGrowingInput.js
Line 12:
from: (function(){
to: (function($){Line 80:
from: })();
to: })(jQuery);TextboxList.AutoComplete.js
Line 13:
from: (function(){
to: (function($){Line 211:
from: })();
to: })(jQuery);3) When clicking the remove/delete cross, its href is # causing the page to jump.
I can resolve #3 but #1 is a concern. Any idea’s?
Thanks
Gav
-
Gavin about 1 year ago
Anything? We would love to purchase a license but we have to ensure it will work for us.
-
-
Mucky about 1 year ago
One Probelem for me ist that ALL values for autocomplete must be loaded with ajax on document.ready. Is it possible to call the ajax-json everytime the user enter or remove a character, maybe with timeouts? Just like other autocomplets work. If i have a very huge list of values its not practical to load all values at the start.
-
Jason about 1 year ago
Noticed an error when “onlyFromValues: True” …. if the user types in some random word It gives me an error
Current is NULL [Break on this error] if ((e.target == list.get(0) || e.ta…’:last-child’).get(0))) focusLast(); TextboxList.js (line 43)
Any ideas?
-
Hi Jason,
I have similar error, but not exact, it throws [index is undefined] when select one options. -
Ben 11 months ago
Yue, I just had the same problem as you. I fixed it by adding a test for:
if (index)
right before the line in Textboxlist.Autocomplete.js that reads:
index.push(value); (around line 146)
-
-
Guillermo, you are the best !
I liked too much your tool wp-o-matic, I’ve used it a lot with excelent results; but this new idea is extremally usefull and wonderfull and beutifull and and and …Right now I’m viewing your website for my first time, and I’ve bookmarked it for considerate for web tools
Thanks,
Ariel -
Bartolome about 1 year ago
This is a lovely script. Unfortunately, I use prototype. Normally, I can get jquery to work on the same page as prototype thanks to jquery’s brilliant noconflict function. With this script, though, I can’t. Firebug spits out an error stating “this.toPaddedString is not a function” when it loads up Prototype! I have a feeling there is something in your code that is causing this to happen. I’m not saying it’s your fault – but I am saying that if you could fix it, you’d get another paying customer!
-
Guillermo Rauch about 1 year ago
I’ll look into it!
-
Awesome. You’re a rockstar.
-
The problem lies in the GrowingInput.js script. Commenting out
calc.css(p, element.css(p));
fixes the problem, though at what cost? Not sure, the script looks the same to me..
-
Ok that was my mistake. $.each passes the index first, not the value. I fixed it and released 0.3. Not sure how it affected Prototype, but hopefully it’s fixed now.
-
OK, I’m starting to see how the backend works. I initially thought autosuggest.php was called only after the user started typing. Instead, it looks like it’s called as soon as you click. The upside to this is that it starts loading sooner than it would if you waited for a keystroke. The downside is that you can’t run any screening on the backend. For example, if I have a database with 6,000 records, I might want to run some sort of screen based on what the user has typed in. For example, if they type in ’s’, I might want to only empty out records starting with ’s’ to cut traffic by a factor of 26. With the current setup, I can’t do that. If you can’t change the backend’s response based on the input, it might as well be embedded in the page instead of returned via Ajax, right? I.e., it’s not dynamic.
I just need to look to see how to get this to submit a GET request to autosuggest.php when the user types, instead of on load or when they first click. Anyone have suggestions for how to do that?
-
This is something I might eventually add. But usually, the idea of the tokenizer is that you work with pre-fetched data. It’s the case of Gmail or Facebook contacts list, which is fetched once via AJAX and made persistent.
Also, the class is designed in such a way that it’s easy to extend and add this functionality, because I had it in mind at the time of writing the API.
-
Olivier REfalo about 1 year ago
Bartolome I am with you with on this one.
Guillermo in a different post was saying that the backend was flexible
enough to allow these kinds of queries. In fact I even asked him his 2c
advise to implement it and now only realize why I didn’t get any answer…
If only I had known before purchasing… I guess this is not plug and play,
I’ll have to get my hands dirty…
-
-
Sean about 1 year ago
This script is spectacular! Extremely well done!
I think a great addition would be an option to add a tag with a comma while using autocomplete. This would allow a user to input tags that may not be in the autocomplete list.
Thanks again!
-
That’s already an option
-
I see that it can be done (which is awesome) but when autocomplete is activated it seems to bypass that bit option. This is the script I’m working with; I apologize if I am missing something obvious.
var t4 = new TextboxList(‘form_tags_input’, {bitsOptions:{editable:{addKeys: 188}}, unique: true, plugins: {autocomplete: {}}});
if I do something else in the bit options like hiding the delete button that will work but comma adding still will not:
var t4 = new TextboxList(‘form_tags_input_3′, {bitsOptions: {box: {deleteButton: false}, editable:{addKeys: 188}}, unique: true, plugins: {autocomplete: {}}});
Thanks!
-
Yes you’re right. Actually that’s what happens due to a limitation in the order events are fired which I can’t workaround. The only solution I can think of would be to repeat code. I’ll evaluate it more thoroughly soon.
-
Sorry if I’m not understanding this correctly but right now there is a way to get around the problem and get autocomplete + comma tags to work? Can you give an example?
-
-
Dan about 1 year ago
Nice. Can’t wait for the (previously mentioned) Dojo version. We’ve got a few domains we’ll almost certainly end up using it on…
-
All reported bugs have been fixed. Keep comments coming!
-
Hi… Same problem as above, I can’t get autocomplete with the comma. Is there a way we can do it? Can you give us an example? Thanks!
-
-
Having a lot of issues getting it to work on FF3. Line 89 in the autocomplete stop() isn’t a method – should be stopPropagation()? also, line 96.. search() is not a function.
-
Make sure you didn’t download the MooTools version
Worksforme perfectly on FF3 -
thanks for the quick response! I’ve got the right version and it works perfectly up until I select an item from the autocomplete, then it throws ev.stop() is not a function. I’m on FF 3.0.9 in Ubuntu 9.04.
-
I stand corrected. Happens when you click, it seems I only tested keyboard. Quick answer. Replace ev.stop() with:
ev.stopPropagation();
ev.preventDefault();
I’ll look into another reported issue for IE7 and provide a maintenance release for both things. Sorry for the trouble.
-
Nice! Last one – after clicking on an item from the autocomplete, it is now added to my input as expected, but the error “search is not a function” is thrown on line 96.
-
I’m fixing all IE issues right now.
-
-
Thanks heaps for putting a jQuery version out. Your moo implementation was almost enough to get me to start using mootools in addition to jQuery, but I’m very happy that I don’t have to now
-
Volkan about 1 year ago
Look great but I cant seem to work it in IE7. I receive a javascript error: Object does not support this property or method.
-
I tested on IE8/IE8 compat… I’ll have a look at it again, must be something minor.
-
-
Awesome. Thank you so much for fixing the bit issue!
-
B. Waite about 1 year ago
Thank you so much for porting this to jQuery.
My company will certainly be paying for a license. Cheers!
-
Ahh you beat me to it
-
Thank you very much for porting it to jQuery, this was one of the few little gems I’ve always envied the MooTool’s guys for. You might want to update your jQuery projects page as well (http://devthought.com/projects/jquery/).
In regards to the auto complete interfering with the ability to use a comma as a the key event: I read above that it seems to be fixed. Although I am not able to get it to function when combined with the auto complete. Is this by design? Or is there a work around for this behavior?
Second, I noticed I am getting some sort of odd behavior when I have focused on the input field, and press enter it puts an empty box with the delete “X”. If I remove the unique parameter, I can enter in as many as these blank boxes as I hit enter. I don’t recall this happening before. I did, however, use the mootools one before. Is this only with the jQuery version, or am I missing an important setting?