|
Another solution: you could simply check the variable total of autosuggest object - it holds the # of available suggestions to the typed keyword. If it is 0 - the typed text is not in the list.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
How is this done?
Can you provide an example for checking the total and/or selectedIndex variables?
Thanks
|
|
|
|
|
Hi,
you create the autosuggest object by calling it's constructor:
var obj = new autosuggest(parameters)
and then, in script, just check:
if(obj.total)
{
}
else
{
}
Very simple
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Hi,
Is there a mean to display the full list of the array as soon as the text area get the focus, then shorten the suggestion list according to the characters entered?
I'm trying to hack your code to do that.
Regards,
Flamme
|
|
|
|
|
new public variable:
this.display_all = true
in suggest:
if (!this.display_all)
{
for(var i = 0; i < al; i++)
{
var key = this.keywords[i];
var value = this.values[i];
if(re1.test(key))
{
++this.total;
matchArray[matchArray.length] = key;
matchVArray[matchVArray.length] = value;
}
else if(after && re2.test(key))
{
++this.total;
afterArray[afterArray.length] = key;
afterVArray[afterVArray.length] = value;
}
else
{
otherArray[otherArray.length] = key;
otherVArray[otherVArray.length] = value;
}
}
}
else {
for(var i = 0; i < al; i++)
{
++this.total;
matchArray[matchArray.length] = this.keywords[i];
matchVArray[matchVArray.length] = this.values[i];
}
}
|
|
|
|
|
Do you want to display the full list when user focuses the input field? If yes, then find the setupEvents method, and modify it:
setupEvents: function()
{
if(!this.evsetup)
{
this.evsetup = true;
this.addEvent(document, "keydown", this.funcCheck);
this.addEvent(this.field, "blur", this.funcClear);
this.addEvent(document, "keypress", this.funcPress);
}
this.preSuggest(-1);
},
Hope it helps,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
> Do you want to display the full list when user focuses the input field?
Yes, this is what I am trying to do.
Thanks for your help.
But it does not seem to work.
Regards,
Flamme
|
|
|
|
|
flammme wrote: But it does not seem to work.
My bad. Just tested - the edited method should be:
setupEvents: function()
{
if(!this.evsetup)
{
this.evsetup = true;
this.addEvent(document, "keydown", this.funcCheck);
this.addEvent(this.field, "blur", this.funcClear);
this.addEvent(document, "keypress", this.funcPress);
}
var that = this;
this.timer = setTimeout(function()
{
that.preSuggest(-1);
},
25);
},
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Thank you. It works.
May I ask what should I do to have this behaviour when we enter a delimiter for multiple autocomplete entries?
Regards,
Flamme
|
|
|
|
|
Hi, Dmitry !
I used the variable start_check as a trigger for this "auto-open" feature. If it is zero - auto-open is enabled.
And trying to forsee possible situations, I've added some code to checkKey function.
So now it looks like this:
checkKey: function(event) {
event = event || window.event;
var code = event.keyCode;
var obj = event.srcElement || event.target;
obj = obj.autosuggest;
obj.caret_moved = 0;
var term = "";
obj.stopTimer();
switch (code) {
<...............>
default:
if (code == 8 && obj.field.value.length == 1 && obj.start_check == 0)
code = -1;
obj.caret_moved = 0;
obj.timer = setTimeout(function() {
obj.preSuggest(code);
},
(obj.response_time < 10 ? 10 : obj.response_time));
}
},
<.................>
setupEvents: function() {
if (!this.evsetup) {
this.evsetup = true;
this.addEvent(document, "keydown", this.funcCheck);
this.addEvent(this.field, "blur", this.funcClear);
this.addEvent(document, "keypress", this.funcPress);
}
if (that.start_check == 0) {
var that = this;
var s;
if (that.field.value.length > 0)
s = that.field.value;
else
s = -1;
that.timer = setTimeout(function() {
that.preSuggest(s);
}, 25);
}
},
Regards,
Gennady
My English is permanently under construction. Be patient !!
modified on Sunday, December 20, 2009 6:04 AM
|
|
|
|
|
It can be useful to insert in the text field the value instead of the keyword.
Here are the code replacements:
this.full_refresh = false;
+ this.insert_values = false;
this.use_iframe = true;
this.displayed = false;
- var kl = this.keywords.length;
+ var kl = (this.insert_values) ? this.values.length : this.keywords.length;
for(var i = 0, c = 0; i < kl; i++)
if(this.bool[i] && (c++ == this.current))
break;
this.selectedIndex = i;
- this.insertWord(this.keywords[i]);
+ if (this.insert_values)
+ {
+ this.insertWord(this.values[i]);
+ }
+ else
+ {
+ this.insertWord(this.keywords[i]);
+ }
if(this.onSelect)
this.onSelect(i, this);
Regards,
Flamme
|
|
|
|
|
Good evening,
not sure this should be a built-in functionality - I can't think of any scenario when user, when searching for a particular value, will want a code (=value) for it. As your solution, here is simplier one:
ew autosuggest("target", custom_array, null, function(index, control) { control.field.value = control.values[index]; });
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Good evening,
Thank you.
Put values could be very useful. Examples:
My users have to enter some cryptic stuff, like "a0a;a+" or "F.()" or etc.
They don't usually know what to write, so I put a description text and what they select enters the cryptic stuff.
My main goal is to reproduce text fields menu of Google Code:
http://img33.imageshack.us/img33/2740/googlecode.png
Regards,
Flamme
|
|
|
|
|
flammme wrote: My main goal is to reproduce text fields menu of Google Code:
I'm currently working on version 3.0 of the autosuggest control - it will help in this
Hope to have is posted on 12th or 14th.
Regards,
Dmitriy.
Listen up! "Teamwork" means staying out of my way! (Seifer, Final Fantasy 8).
|
|
|
|
|
Great.
Thank you.
Regards,
Flamme
|
|
|
|
|
Hi Dmitry
Thanks for the update, It works fine
I suggest add another capture to this page (codeproject), including the use_scroll=true (no arrows, like this[^]), it would be easier for new users to associate with select-combo behaviour.
Also, I suggest include a working example in this page, as zichun[^] has.
Best Regards
modified on Friday, November 20, 2009 8:36 AM
|
|
|
|
|
In old version that I have used, when typing, the suggest items was auto highligth and if press enter button the highligth item is select. In the version 2.3 this function was done. Is it possible reactivate this function?
thanks
max
|
|
|
|
|
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).
|
|
|
|
|