TextboxList 0.4: On-Demand suggestions
TextboxList 0.4 is out, with new features:
checkoption, which can allow you to specify a function to filter out new boxes that do not meet a requirementencodenow receives the complete values, not only the id or string of the bit. This gives you full control of what you want to send to the server.-
Autocomplete now works with on-demand suggestions. As easy as this:
new TextboxList('form_tags_input_4', {unique: true, plugins: {autocomplete: { minLength: 3, queryRemote: true, remote: {url: 'autocomplete2.php'} }}});
And some bugfixes:
- Fixed missing index when unique: false and autocomplete were used, which resulted in an error
- Fixed problems with items with id 0, which incorrectly evaluated as false.
Head to the demo to see the new autocomplete in action, and as usual, report any bugs you might encounter.
Update: 0.5 is out already, which fixes a bug with the traditional use of Autocomplete. Sorry for the trouble!
-
First off all, definitely a great script, and a powerful tool… I’ll by a license for it as soon as I finish website I’m developing…
Just one thought in a form of suggestion… I noticed that return string is in a form of comma separated values… I guess it could be user controlled which character will be delimiter, since here where I live (Serbia) our decimal point is in fact a comma, so it is not quite good for delimiter.
I found it quite easy to change it in a source code, but it could be passed as an option to the class creator.
Great script all in all! -
I JUST WANA KNOW HOW TO POST the id of the element i connected it to database but i dunt know how to post the id please help
-
Jesper 10 months ago
I am really considering buying this script, allthough I need to fix one issue… How do I get scabdinavian letters (æøå) out in the autocomplete… Every name with these kind of letters are not showned at all…. How do I solve this… Please help
-
Guillermo Rauch 10 months ago
Guys, over the next few days I’ll be rolling out TextboxList 0.5 for jQuery with lots of improvements. Also, hopefully I’ll be able to write down some server side examples for all of you struggling with autocompletion.
Stay tuned!
-
I have tryid about a million of different ways to implament the use of mysql, but with no luck… Is there something I’m missing???
Here is what I have done:
//////////////////////////////////////////////$response = array();
$sql = mysql_query(“SELECT * FROM fb_users”);
$names = array();
while($row = mysql_fetch_array($sql)){$names[$row['new_userid']] = $row['fname'].’ ‘.$row['lname'];
}
foreach ($names as $i => $name)
{
//$filename = str_replace(‘ ‘, ”, strtolower($name));
//$response[] = array($i, $name, null, ‘ ‘ . $name);
$response[] = array($i, $name, null, $name);
}header(‘Content-type: application/json’);
echo json_encode($response);//////////////////////////////////////////////
I simply can’t see what I do wrong?!?!? Please help me…
-
langh
-
Очень занятные мысли, хорошо рассказано, все просто разложено по полкам
-
Jeff 11 months ago
Thanks for a great script.
Another request for the jQuery version. This is close that what I am looking for, but remote is key since I have to query several thousand rows.
Thanks much!
-
I should clarify. My request is for the UPDATED jQuery version to be consistent with the MooTools version (0.5) that supports on-demand calls.
-
-
John 11 months ago
This code is wonderful, and plus in jquery, it helps me a lot… now I have (probably) a (dumb) question but since you can POST the names you typed in, is there a way to “rebuild” the content of the input from a saved field, like saving ids in a database and wanting to edit it…
just like working with email distribution lists, actually ?
i know that you can preload data in the input, but I wonder exactly what to “push”… thx in advance… -
Alagiri 11 months ago
I have problem with PHP 5.1.6 version.
Please send details for run php5 version.
now php5.2.9 version code working fine -
Tristan 11 months ago
This is a great script and I plan on purchasing soon. I plan on using it in two different ways on my site. I’m trying to setup the second instance and have two questions:
1. How do you force the input field to remain one line tall?
2. Is there a way to allow people to delete a part of a bit, rather than the whole thing?Thanks much,
-Tristan
-
I think I just found another issue that may have hit other users (sorry if it’s been reported before). Using the jquery version, I get an error if I click into the input field and then click in it again right away (without typing anything). I traced the error to line 43 of TextboxList.js where the variable ‘current’ is null but the function call toElement() is being called on it.
I’m not 100% sure whether I’ve changed the intent of this line, but it seems to work without error if I simply test whether current is null beforehand. Line 43 now turns to:
if ((e.target == list.get(0) || e.target == container.get(0)) && (!focused || (current && current.toElement().get(0) != list.find(‘:last-child’).get(0)))) focusLast();
Hope that helps some others…
-
Philip 11 months ago
i also found this issue and fixed it the same way. no problems so far.
-
-
Ben 11 months ago
Looks great. I am trying to use the jquery version with autocomplete and am having an issue. When I type a few characters in the input field and then click on one of the matches, I get a bug in Firebug that says “m is undefined”. Any ideas as to what might be happening? It feels like I may have initialized the plug-in incorrectly, but I can’t see what’s wrong.
-
Oh, I think I solved the problem. In the jquery version of TextboxList.Autocomplete.js, I think you need a test for “if (index)” right before calling index.push(value) (around line 146). Sometimes, that value is undefined, as you don’t always set it in init(). That’s consistent with how you’ve implemented it in the mootools version.
-
had the same problem. thx for the solution!
-
-
Nic 12 months ago
Is there a way to make it so that hitting “Enter” when the cursor is in the box (rather than selecting an autocomplete) submits the form as normal? I’ve tried the stopEnter option but I’m not sure what effect it had. (I’m using the jQuery version, but if this is possible only with the Moo version I can probably port it over.) Thanks!
-
Marwan 12 months ago
I dont see how the “remote” is happening. In the php file the script seems to be the same. How could i modify it to retreive the 3 characters that i will perform the search in the database to remotely get the suggestions? example: select * from db.table where suggestion like “3caracters”*;
-
Arnóbio about 1 year ago
the complete code with autocomplete.php please!
arnobiomata@gmail.comI Love it!
sorry for my speech! i am brazilian, my english is weak.
-
Да, инет – огромен, если и такое можно найти
-
Tom about 1 year ago
I’m kind of new to php, mysql and javascript so I was wondering if someone could help me connect this script to my mysql database. I tried using VlajChe’s script but it doesn’t seem to work. Is it just me and how can I make it work? Thanks!
-
VlajChe about 1 year ago
My database returns names with characters like šđžćč etc. And if name has such character it doesn’t appear in autosugest list… Can anyone help me with this?
-
Nic about 1 year ago
I have ported this feature over to the jQuery version for my own use and submitted that to Guillermo. There’s a copy here http://pastebin.com/ff7de717 if you want to use it in the meantime.
-
Whoops, I had hard-coded the remote URL in that code. Here’s one that uses the “url” option given to the autocomplete plugin: http://pastebin.com/d7799840a
-
-
George about 1 year ago
I’m still confused as to how you would use a mysql database instead of the page for getting the suggestions. Could someone please help me? Thanks!
-
Here is what I did in file autocomplete.php:
Let’s assume that you are already connected to your db…
In your db you have table users with fields id and name$query = “SELECT id, name FROM users”;
$result = mysql_query($query);$names = array();
// First you create an array which will have user id as key
// and name as valuewhile($row = mysql_fetch_array($result, MYSQL_ASSOC))
{
$names[$row['id']]=$row['name']
}// Then evrything else is the same….
foreach ($names as $i => $name)
{
$filename = str_replace(‘ ‘, ”, strtolower($name));
$response[] = array($i, $name, null, ‘ ‘ . $name);
}header(‘Content-type: application/json’);
echo json_encode($response);Hope that this helps
-
George about 1 year ago
Did you get rid of the lines that say “$response = array();” and “$names=array()” in autocomplete.php?
-
-
Blaz about 1 year ago
Will it ever be ported to prototype framework also? Is it possible for prototype and mootools to coexists?
-
Great work! I do have one question though. What was the reason you check for the focus inside of “onRemove”? (line 163 in TextboxList.js)? If you click on x to delete, the field itself never gets focus, and index became inconsistent with what’s shown.
-
ARS about 1 year ago
Why do you use another index array in the autocompleter plugin (this.index) instead of rely on this.textboxlist.index at all?
To make it work for my needs I had to modify line 102 (showResults) to:
if (this.textboxlist.index) { results = results.filter(function(v){ return !this.textboxlist.index.contains(this.textboxlist.uniqueValue(v)); }, this); }
(also I totally removed the this.index property from the autocompleter, because it’s value was used only in the showResults function)
Using this I can put existing values (bits) to the control when the page loads, and then the autocompleter will not show them again in the dropdown. Tell me please if you know a better way to solve my problem.
Hope you got it, sorry for my poor english.
Anyway, thanks for this great component, it’s very useful! -
pichon about 1 year ago
Hi, thanks a nice library.
I’ve found some bugs in jQuery version.
1. click on a blank space on a autocomplete input box, it causes error. (Safari 4.0)
> TypeError: Result of expression ‘current’ [null] is not an object. – TextboxList.js:432. when input value is autocompleted, posted value is ID (not text).
Thanks.
-
I’m fond of your script ! It’s so good !
I would like to use it on my own web site but i can’t manage to tune it. What I mean is that I would like to start a search thanks to a function.
For instance :
1) Creation of the textBoxList
departement = new TextboxList(‘departement’, {unique: true, max: 1, plugins: {autocomplete: {onlyFromValues: true}}});
new Request.JSON({url: ‘/departement.json’, onSuccess: function(r){
departement.plugins['autocomplete'].setValues(r);
departement.container.removeClass(‘textboxlist-loading’);
}}).send();2) Execution of the search thanks to a button :
searchOnMyTextBoxList(departement, “my word”);
3) Appearing of the search result on my departement textBoxList
Can you help me ?
Thank you again for your marvelous script !
-
Olivier about 1 year ago
Good job Guillermo, will give it a try (mootools) tonight.
-
Hum, is it only me or the demo does pull up any dynamic proposals ?
OSX/Safari or Firefox
-
?
-
Hum, is it only me or the demo doesN’T pull up any dynamic proposals ?
In other words, no suggestion are showing up as I type…
-
Type Dan, then wait a little bit.
-
-
Mucky about 1 year ago
I see that version 0.5 is already out, great plugin!
Is it possible to implement the new features in the jquery plugin? I dont wanna change the framework -
I definitely will.
-
this script is great.
we would like to buy it when we finish our current project.
but we noticed a problem with special characters here is our problem:
if we type one of these turkish characters, textboxlist is listing the results which contains one of these character in the middle of the word…
For e.x: if u type ‘ç’, adaçayı, ayçiçekyağı and etc.. show up.
but if u wanna find a word which starts with these characters, for example: şeker, çay, çilek…. they wont be listed.
http://www.persefer.com/yemek/
could you please check our site?
thanks…