PDA

View Full Version : Type more than 1 char into a drop-down list


S1m0ne
01-10-2005, 03:48 PM
I am a copy and paster and trying to quit ...

I cannot remember the site nor the author, but it works BEAUTIFULLY!
I have changed the timeoutInterval to 500 milliseconds as I type with one finger - the original was 250 or even less.

<script language="JavaScript">
// script allows you to type more than one character into a drop-down list
//
//A typical drop-down need to have ONKEYPRESS and ONKEY functions added
//
//Example: <SELECT ID='vc_DESCRIPTION' NAME='vc_DESCRIPTION' onkeypress='listbox_onkeypress()' onblur='listbox_onblur()'>


var toFind = ""; // keyboard buffer
var timeoutID = ""; // process id for timer - when stopping the timeout
var timeoutInterval = 500; // milliseconds - keyboard buffer
var timeoutCtr = 0; // initialise of timer countdown
var timeoutCtrLimit = 3; // number of times timer is allowed to count down
var oControl = ""; // maintains a global reference to the user control

function listbox_onkeypress(){

window.clearInterval(timeoutID)
oControl = window.event.srcElement;
var keycode = window.event.keyCode;

if(keycode >= 32 ){
var c = String.fromCharCode(keycode);
c = c.toUpperCase();
toFind += c ;
find(); // search the listbox
timeoutID = window.setInterval("idle()", timeoutInterval); // restart the timer
}
}

function listbox_onblur(){ // function is called when user leaves listbox

window.clearInterval(timeoutID);
resetToFind();
}

function idle(){ // function is called if timeout expires - 3rd time stops timer and clear kb buffer

timeoutCtr += 1

if(timeoutCtr > timeoutCtrLimit){
resetToFind();
timeoutCtr = 0;
window.clearInterval(timeoutID);
}
}

function resetToFind(){

toFind = ""
}

function find(){

var allOptions = document.all.item(oControl.id);

for (i=0; i < allOptions.length; i++){
nextOptionText = allOptions(i).text.toUpperCase();

if(!isNaN(nextOptionText) && !isNaN(toFind) ){
nextOptionText *= 1;
toFind *= 1;
}

if(toFind == nextOptionText){
oControl.selectedIndex = i;
window.event.returnValue = false;
break;
}

if(i < allOptions.length-1){
lookAheadOptionText = allOptions(i+1).text.toUpperCase();

if( (toFind > nextOptionText) && (toFind < lookAheadOptionText) ){
oControl.selectedIndex = i+1;
window.event.cancelBubble = true;
window.event.returnValue = false;
break;
}
}
else{

if(toFind > nextOptionText){
oControl.selectedIndex = allOptions.length-1
window.event.cancelBubble = true;
window.event.returnValue = false;
break;
}
}
}
}
</script>

glenngv
01-11-2005, 05:22 AM
There is a similar script here in this forum. See "Editable Type-ahead Combo" in my sig.

S1m0ne
01-12-2005, 05:33 AM
Glenn

I have downloaded your code and checked it out - Works like a charm. This just shows there are more than one way to skin a cat.

I am a person that likes to optimise, but creation is not my strong point. Would it be possible for you to use asci char codes instead of the real chars? For example Chr(13) equals "ENTER" I think?

To optimise, would it be possible for you to use a FOR loop, to get all the asci codes without physically typing each one?

Regards

Sim0ne

hemebond
01-12-2005, 10:50 PM
I can do this already. What browser do you guys use?

codegoboom
01-13-2005, 07:29 AM
Ahem, this forum is not for posting unauthorized script mods...

S1m0ne
01-13-2005, 08:51 AM
Hemebond - I am currently using IE and Opera.

CodeGoBoom - I agree. It was just something new for me as I am a "copy and paster" and I did not previously seen many sites with this kind of functionality. Let's close this subject.