SitePoint Sponsor |
|
User Tag List
Results 1 to 25 of 28
-
Jun 21, 2004, 12:29 #1
Article Discussion
This is an article discussion thread for discussing the SitePoint article, "Make Life Easy With Autocomplete Textboxes"
-
Jun 27, 2004, 17:57 #2KesterSitePoint Community Guest
There is a closing bracket missing here at the end:
default:
textboxReplaceSelect(oTextbox, String.fromCharCode(isIE ? oEvent.keyCode : oEvent.charCode);
-
Aug 10, 2004, 18:47 #3JamieSitePoint Community Guest
An interesting use of Javascript to make life easier for the user. However, I don't understand where the values in the array come from. Please explain. Also, a working example would be beneficial. Thanks.
-
Sep 23, 2004, 16:30 #4carlosSitePoint Community Guest
I don't know if it matters, but you can make this auto-complete function case-insensitive by making the string in the area lowercase (or upper) and the sText. For example: arrValues[i].toLowerCase().indexOf(sText.toLowerCase())
-
Oct 7, 2004, 20:27 #5PlebianSitePoint Community Guest
Jamie suggested a working example would be beneficial - there seems to be one at the author's own homepage: http://www.nczonline.net/
If you go to the downloads section there is a Zip file with the example used in this article.
-
Nov 3, 2004, 20:43 #6mattSitePoint Community Guest
add an extra ) on the end of line 86
charCode);
becomes
charCode));
:)
-
Jan 15, 2005, 00:59 #7
- Join Date
- Jan 2005
- Location
- Hyderabad
- Posts
- 2
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
That was a nice one. Good work.
-
Jan 31, 2005, 14:37 #8EmilioSitePoint Community Guest
For Case!
function autocompleteMatch (sText, arrValues) {
for (var i=0; i < arrValues.length; i++) {
if (arrValues[i].indexOf(sText.toLowerCase()) == 0) {
return arrValues[i].replace(sText.toLowerCase(), sText);
}
}
return null;
}
-
Feb 10, 2005, 12:16 #9JohnSitePoint Community Guest
IMHO, in IE, this code will not work if the text box is imbedded in a form. event.keyCode returns "undefined." In IE, you can use window.event.keyCode in the autocomplete function to get the code. (In the example, the text box appears in the page, but no form.) After correcting per Matt's post, the sample code works in Firefox "as is," and works in IE (but not in a form).
-
Feb 25, 2005, 01:12 #10UrbanSootSitePoint Community Guest
RE: For Case!
Your function caused an error... Here is the working version:
function autocompleteMatch (sText, arrValues) {
for (var i=0; i < arrValues.length; i++) {
lTxt = sText.toLowerCase();
if (arrValues[i].indexOf(lTxt) == 0) {
return arrValues[i];
}
}
return null;
}
-
Mar 5, 2005, 17:18 #11EmilioSitePoint Community Guest
RE: Your function caused an error...
Your function also causes an error, and it is for the same reason mine does. For some reason I did not copy the function over properly. Here is the working version:
function autocompleteMatch (sText, arrValues) {
for (var i=0; i < arrValues.length; i++) {
if (arrValues[i].indexOf(sText.toLowerCase()) == 0) {
return arrValues[i].replace(sText.toLowerCase(), sText);
}
}
return null;
}
The previous function returned an error because you need to give the function the index of the array ( arrValues[i].indexOf... ). Your function is also different than mine in that your function replaces the entire input string back to whatever is in the array, while mine keeps what the user has inputted and appends what is in the array.
For example: mine- a user enters R and the function returns Red.
Yours - a user enters R and the function returns red.
Both work so it is just a matter of preference.
-
Mar 9, 2005, 15:07 #12
- Join Date
- Mar 2004
- Location
- East Bay Area, CA, USA
- Posts
- 28
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I tried all three versions of autocompleteMatch and all three returned an error. Any ideas?
-
Mar 18, 2005, 14:32 #13MaxSitePoint Community Guest
There's a missing parenthesis; here's the corrected line, in the autocomplete function:
textboxReplaceSelect(oTextbox, String.fromCharCode(isIE ? oEvent.keyCode : oEvent.charCode));
Also, my javascript debugger complained on the funny quotes used in the browser detection code...I'd replace with regular double quotes.
Max
-
Jun 8, 2005, 05:50 #14MadSitePoint Community Guest
you need to use the "i" variable in your loop on the "autocompleteMatch" function :
for (var i=0; i < arrValues.length; i++) {
if (arrValues[i].indexOf(sText.toLowerCase()) == 0) {
return arrValues[i].replace(sText.toLowerCase(), sText);
}
}
-
Jun 28, 2005, 02:51 #15mARTINvSitePoint Community Guest
Brilliant
-
Dec 12, 2005, 13:11 #16alotsSitePoint Community Guest
I tested this example and a i gave the mistake:
object is expected when i put some char... in the field...
-
Dec 19, 2005, 01:52 #17AnonymousSitePoint Community Guest
same error for me, object expected
-
Dec 21, 2005, 06:10 #18
- Join Date
- Dec 2005
- Posts
- 1
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
by replacing
Code:var isOpera = navigator.userAgent.indexOf(”Opera”) > -1; var isIE = navigator.userAgent.indexOf(”MSIE”) > 1 && !isOpera; var isMoz = navigator.userAgent.indexOf(”Mozilla/5.”) == 0 && !isOpera;
Code:var isOpera = navigator.userAgent.indexOf('Opera') > -1; var isIE = navigator.userAgent.indexOf('MSIE') > 1 && !isOpera; var isMoz = navigator.userAgent.indexOf('Mozilla/5.') == 0 && !isOpera;
-
Jan 25, 2006, 07:05 #19rebuggerSitePoint Community Guest
textboxReplaceSelect(oTextbox, String.fromCharCode(isIE ? oEvent.keyCode : oEvent.charCode);
One missing ) at the end....
-
Feb 18, 2006, 08:56 #20Carlos Eduardo CruzSitePoint Community Guest
function autocomplete(oTextbox, oEvent, arrValues) {
switch (oEvent.keyCode) {
case 38: //up arrow
case 40: //down arrow
case 37: //left arrow
case 39: //right arrow
case 33: //page up
case 34: //page down
case 36: //home
case 35: //end
case 13: //enter
case 9: //tab
case 27: //esc
case 16: //shift
case 17: //ctrl
case 18: //alt
case 20: //caps lock
case 8: //backspace
case 46: //delete
return true;
break;
default:
textboxReplaceSelect(oTextbox, String.fromCharCode(isIE ? oEvent.keyCode : oEvent.charCode));
var iLen = oTextbox.value.length;
var sMatch = autocompleteMatch(oTextbox.value, arrValues);
if (sMatch != null) {
oTextbox.value = sMatch;
textboxSelect(oTextbox, iLen, oTextbox.value.length);
}
return false;
}
}
-
Feb 22, 2006, 08:47 #21IzzySitePoint Community Guest
To the auhor -
At least make sure your code works before you post it. There were 2 errors in your code I had to fix.
-
May 23, 2006, 15:04 #22
- Join Date
- Aug 2003
- Location
- USA
- Posts
- 61
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Question...
I know this is an old thread but...
Question: How can I alter this script so that i can type in one field and autocomplete multiple fields? i.e. If i begin typing in the 'Firstname' field can it autocomplete the 'LastName' field.
Or, alternatively, how can I use a <select> on field 1 and have the resulting selection populate the rest of the fields from an array? i.e. Select 'phone' and have the firstname, lastname, etc. fields automatically populated after the selection is made.
-
Feb 27, 2007, 07:39 #23maxSitePoint Community Guest
Hello,
I was wondering how one would go about if one wanted to apply the "getDocumentById('textBoxid')and addEventListener" approach instead of using the onkeyPress. Hope you understand what I mean.
I fail every attempt with this great script.
-
Apr 14, 2007, 11:15 #24jacSitePoint Community Guest
What are the two errors? I can't spot them
-
May 29, 2007, 03:50 #25
- Join Date
- Nov 2005
- Posts
- 1
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
checking the text box on delete
I have implemented the sript and it works great for me.
The only problem I have is when people enter information for instance: Violete and then delete the last e it the autocomplete will turn off and not add the selected e. ANY THOUGHTS ON HOW TO IMPLEMENT THAT CHANGE?
Bookmarks