By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,334 Members | 1,861 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,334 IT Pros & Developers. It's quick & easy.

<select> box

P: n/a
I have a select box with a lot of entries in it, some of which start with
the same letter.

I want the user to be able to type the first few letters into the select box
and have the list "move" to the appropriate place.

any one know how to achieve this?

TIA
Steve
Jul 23 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Unfortunatly the select box isn't editable in most browsers (if it can
be made editable, I didn't know) However, there is kind of a solution
for this. The most simpelest (and inefficient way) of searching for
a string and selecting it could be this:

function seek(str) {
select = document.getElementById("selector");
for (i=0;i<select.options.length;i++) {
v = select.options[i].value;
if (v.length>=str.length) {
if (v.substring(0, str.length)==str) {
select.options[i].selected = true;
return;
}
}
}
return;
}

Suppose your code looks like this

<SELECT ID="selector" onKeyPress="jump(event);">
</SELECT>

Then you could handle the onKeyPress event like this.

str = "";

function jump(e) {
e = (e==null?window.event:e);

if (e.keyCode==8) { // backspace
str=str.substring(0, str.length-1);
} else {
// don't know exactly if that is the right function
key = String.fromCharCode(e.keyCode);
if (key>='A' &&.key=<'Z') {
str+=key;
}
}
seek(str);
}
Something like that should work. I didn;t try it though.

Good luck,
Vincent

Steve Wright wrote:
I have a select box with a lot of entries in it, some of which start with
the same letter.

I want the user to be able to type the first few letters into the select box
and have the list "move" to the appropriate place.

any one know how to achieve this?

TIA
Steve


Jul 23 '05 #2

P: n/a
"Steve Wright" <wr****@wcc.govt.nz> wrote in message news:<1086921293.20923@muldoon>...
I have a select box with a lot of entries in it, some of which start with
the same letter.

I want the user to be able to type the first few letters into the select box
and have the list "move" to the appropriate place.

any one know how to achieve this?

TIA
Steve


Without getting into detailed coding, here would be my first
attempt:
1. Have a global variable, keeping track of the letters typed
(call it vKeysPressed for this example)
2. In the body tag, have an event handler
"onkeypressed="Gatherkeys()".
3. in "Gatherkeys()" you would concatenate the key pressed to the
variable vKeysPressed. use the event.keyCode to find out what key is
pressed.
4. Now, using vKeysPressed, search through your select control
for the item which matches vKeysPressed.
Jul 23 '05 #3

P: n/a
Ux
Steve Wright wrote:
I have a select box with a lot of entries in it, some of which start with
the same letter.

I want the user to be able to type the first few letters into the select box
and have the list "move" to the appropriate place.

any one know how to achieve this?

TIA
Steve


Do you really need your user type letters INTO THE SELECT BOX ?
I find this not very clear for users because of the backspaces, del,
arrowkey they can type without to see the complete word actually inserted.
IF you change your mind and decide that the user can type input in a
textbox that drives the selectbox positioning then answer this post.
I've just solved the same problem with a binary search on the options
array. Very fast even on 10000 entry (entry must be sorted).

Ciao
Marco
Jul 23 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.