|
Hi Max,
the "auto highligth" feature can be turned on by switching (in autosuggest.js) the no_default option to false .
Hope it helps,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Thanks!!! it's perfect!!!
Max
|
|
|
|
|
Hey Dmitriy,
First thing I would like to say is awesome job with this script. I have looked long and hard to find a script like this one and this one is fast and efficient.
However I seem to have found a minor glitch. If you use the field and then erase the field without refreshing the page the second time you try a suggestion you want to fill the field with, it will display the list but when you click on an item the list disappears and the insert doesn't happen.
|
|
|
|
|
Good afternoon,
thank you for your praise. Can you please vote for the article? Thank you in advance
As for the glitch - in fact, currently there is no way to "destroy" the control. The bindArray /bindURL interface was introduced to bring new data to the control, so I don't quite understand why it is necessary to destroy the control and create it again.
Best regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
It is not a matter of destroying the control and recreating it is as a user using the control. If you type something in and then erase it and re-type something in and the list shows up when you click nothing happens.
|
|
|
|
|
Understood. 2 questions:
1. Is the issue reproducible with the vanilla script (i.e. in the downloadable sample)?
2. Can you please give the exact, step by step, guide to reproduce the bug?
- Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
I just tested it against the original and it works fine. I need to be able to use the onfocus event within the HTML tag. I have modified your test page to reflect my setup and how I want to use your autosuggest. Please look at the callauto function.
<code>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<script type="text/javascript" src="autosuggest.js"></script>
<script>
var custom_array = ['audi', 'bentley','buick', 'chevrolet', 'chrysler', 'dodge', 'ford', 'gm',
'honda', 'hyundai', 'isuzu', 'jeep', 'kia', 'lamborghini', 'mazda', 'nissan',
'opel', 'pontiac', 'renault', 'saab', 'toyota', 'volkswagen'];
var custom_array_2 = [['audi', 1], ['bentley', 2], ['buick', 3], ['chevrolet', 4], ['chrysler', 5],
['dodge', 6], ['ford',7], ['gm', 8], ['honda', 9], ['hyundai', 10], ['isuzu', 11],
['jeep', 12], ['kia', 13], ['lamborghini', 14], ['mazda', 15], ['nissan', 16],
['opel', 17], ['pontiac', 18], ['renault', 19], ['saab', 20], ['toyota', 21],
['volkswagen', 22]];
var aslist;
function callauto (id, data) {
aslist = new autosuggest(id, data);
}
</script>
</head>
<body>
<table width="100%"><tr><td align="center">
<!-- The most simple installation: -->
<input type="text" style="font-family:verdana;width:300px;font-size:12px" id="tb" value="" onfocus="callauto(this.id, custom_array);"/>
<p> </p>
</td><td align="center">
<!-- Installation with the callback: -->
<input type="text" style="font-family:verdana;width:300px;font-size:12px" id="tb2" value="" />
<script> new autosuggest("tb2", custom_array2, null, function(index, control) { alert("Selected key: \"" + control.keywords[index] + "\" with value: \"" + control.values[index] + "\""); }); </script>
<p>This autosuggest control will display an alert with the selected keyword and value.</p>
</td></tr></table>
</body>
</html>
</code>
I am sure it is because of the onfocus event in the tag and your code modifies the onfocus event. I just don't know how to correct it.
|
|
|
|
|
I don't understand the reasoning behind the:
blenkhn wrote: onfocus="callauto(this.id, custom_array);
custom_array is always the same, why recreate the control on every onfocus? Autosuggest perfectly handles the focus/blur events by itself when created the usual way:
blenkhn wrote: new autosuggest("tb2", custom_array2, null, function(index, control) { alert("Selected key: \"" + control.keywords[index] + "\" with value: \"" + control.values[index] + "\""); });
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Hey Dmitry,
Sorry for the confusion. I have solved my own problem. this is to just leave a message for others who want to use your script.
TO use this control and attach it to a dynamically created field.
Create your formfield and attach it to your form, then run the command,
var variable = new autosuggest("fieldid", custom_array2);
or if you need a callback
var variable = new autosuggest("fieldid", custom_array2, null, function(index, control) { alert("Selected key: \"" + control.keywords[index] + "\" with value: \"" + control.values[index] + "\""); });
|
|
|
|
|
Hi,
many thanks for this excellent tool. I have a small question:
I have a page where I am dynamically added form fields through Javascript at the press of a button. The form field that is added dynamically at each press of a button is:
<input class="leftalign" type="text" name="input_item[]" size="20" />
If I am trying to add something like this to the javascript (using appendChild) that dynamically updates the page with another field:
var obj = new autosuggest("input_item[]", "", "item_retrieve.php?");
it does not work.
Can anyone let me know if something like this could work using this excellent tool?
Many thanks and best regards,
Ronald.
|
|
|
|
|
Hi Ronald,
rver wrote: var obj = new autosuggest("input_item[]", "", "item_retrieve.php?");
1. First parameter of autosuggest is not a name , but id of the input field. The way you have it (i.e. you don't have the id attribute on your input field) - it won't work.
2. I'm not sure that input_item[] is a valid name - because of [] .
Regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
To help you Dmitriy, an autosuggest field doesn't work with the way you are trying to initialize the field. I worked to find a way to do just what you are after and would like to help. It is a different way to look at it. The problem with the new field is that for the autosuggest script to work it needs to be initialized. Another part of the problem is that the onfocus event is used and captured within the script so, my solution is as follows:
Add a new function to the page or a different script attached to the page:
var autoc;
function create_auto(id, data){
autoc = new autosuggest(id, data);
}
and then within the input field tag you need to create the autosuggest add:
onfocus="create_auto(this.id, array)"
this way the field gets initialized when it recieves focus and bypasses the onfocus used in the script
I hope this helps
|
|
|
|
|
The link downloads a version from 2007. May I get the latest code please?
|
|
|
|
|
Oh! There seems to be some mistake at Codeproject's side. I've written to them.
For now - you can write me at dmitrykhudorozhkov@yahoo.com, I'll send you the latest version.
Regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Hi Dmitry
You have done some excellent work here.
I'm having a small issue with having more than one on a page though.
I'm using a client side array and set up the autosuggest to use_scroll = true.
The issue i have is that although the first auto suggest works perfectly, the subsequent ones do not allow for the scroll bar to be moved using the mouse. Using up and down keys is fine and using the mousewheel is also fine.
Clicking on the autosuggest scroll just makes the list dissappear.
This seems to be an issue in IE6/7/8 and Chrome. These are ones i've tested on.
I have tested on FF3 and it seems to work ok.
Any ideas?
Dan
|
|
|
|
|
Hi Dan,
does the sample in the article's archive work ok for you? It uses the exact same configuration that you've described.
Also, are there any errors shown in IE?
Regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Hi
Thanks for the quick reply.
Actually i found that it does work in all the browsers, but i did some testing on the sample in the archive and this issue occurs when the text boxes are rendered off screen, ie, when you have to scroll down the page to reach the text boxes.
The page i'm having the issue with is as described. If i move the text boxes up so they appear nearer the top of the page, then it works fine.
Although that is not the solution i'm looking for, since i want it displayed lower down the page.
thanks
Dan
modified on Monday, August 24, 2009 4:06 AM
|
|
|
|
|
Hi Dmitriy
I found what the issue is.
Its due to the use of a doctype, XHTML in my case. The reference to the document.body.scrollTop becomes incorrect, so i used a piece of code from here...
http://www.javascriptkit.com/javatutors/static2.shtml[^]
A worthwhile addition i think.
Keep up the good work.
Dan
|
|
|
|
|
FINALLY, you detected the problem that I had. I am also using xhtml and can't change to html.
When using xhtml the mouse doesn't work properly in IE.
Thanks and I'll be looking forward the xhtml-compatible version of the script
Best Regards
|
|
|
|
|
Hi,
I have generated a simple php file that generates the following xml file:
<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<listdata>Canada|USA|United Kingdom</listdata>
The php file is as follows:
<?php
$host = "xxxx";
$database = "xxxx";
$user = "xxxx";
$password = "xxxx";
mysql_connect($host,$user,$password);
mysql_select_db($database);
$sql = "SELECT name FROM Creditor WHERE fk_client_id = 1";
$rs = mysql_query($sql);
header('Content-Type: application/xml;');
echo "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\" ?>\n";
?>
<listdata>
Canada|USA|United Kingdom
</listdata>
The autosuggest is invoked as follows:
<label class="block"><span>Crediteur</span><input type="text" name="inputcrediteur" id="inputcrediteur" size="35"/></label>
<script>
var obj = new autosuggest("inputcrediteur", "", "/retrieve_creddeb.php?");
</script>
When I run the page and start typing in the input box, it shows an error on line 1259 saying that this.keywords.0 is null or not an object. Firebug shows that the this.keywords variables are 'undefined'.
I am quite new to all this, so I am assuming I am overlooking something extremely trivial. I would very much appreciate anyone's help in this.
By the way, the autosuggest functionality does work when I use it based on arrays.
Thanks in advance,
Ronald.
|
|
|
|
|
Good evening,
this is a very strange bug - right now I'm trying to debug the issue.
As a quick solution, I can recommend you to set the full_refresh variable to true - this will allow the code to skip the problematic line.
Best regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Found.
There is a bug in the code. The block:
if(comma != -1)
{
var ci = ca.split(that.item_delimiter);
that.keywords[i] = that.keywords_init[i] = ci[0];
that.values[i] = that.values_init[i] = ci[1];
}
else
{
that.values[i] = that.values_init[i] = "";
}
should be:
if(comma != -1)
{
var ci = ca.split(that.item_delimiter);
that.keywords[i] = that.keywords_init[i] = ci[0];
that.values[i] = that.values_init[i] = ci[1];
}
else
{
that.keywords[i] = that.keywords_init[i] = ca;
that.values[i] = that.values_init[i] = "";
}
Sorry for this.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Works! Many thanks indeed for your extremely quick reply!
Best regards,
Ronald.
|
|
|
|
|
Hi Dmitry !
Glad to see that you continue to support your "child", and it justly became very popular.
Nevertheless two notes.
One - minor bug: the name of the variable use_IFrame is used with different case, so it always works as false.
Second - suggestion. May be it has sense to add to the autosuggest object one more property - id. Say, this.id=this.field_id + '_actd' . It may be useful when you have several autosuggest objects and want to use the single OnSelect function.
Regards,
Gennady
My English is permanently under construction. Be patient !!
|
|
|
|
|
Forgot one more suggestion, that as far as I remember, I've already suggested in the past.
So the thead may be called "Three things"
I'm speaking about styling. It would be much more convenient,
if the suggestions style will be in the external css.
And leave the default style inline.
Regards,
Gennady
My English is permanently under construction. Be patient !!
|
|
|
|
|