G
Guest
We cannabalized a javascript that enables a web-form dropdown box to function
like a winform dropdown box.
Let's say you want to find Steven. In a winform dropdown list, you type
"Ste" and you are on Steven. Press enter or tab, and away you go to the next
form field. But in a webform, when you type ste it does three things. First
it take you to Sam, then to Tammy, and finally to Eba. The script at the
bottom of this e-mail causes a webform dropdown to work like the first
example, a winform, not the second, a webform. Great!
Here is the problem. With this script it appears that the
dropdown_selectedIndexChanged event never gets raised. I need both the
modified functionality and the raised event to occur. The script follows for
your perusal.
What am I doing wrong?
Thanks in advance for your help.
Steven
Public Shared Sub sbListFind(ByRef pgPage As System.Web.UI.Page)
Dim Script As New System.Text.StringBuilder
'Dim ClientID As String = ListControl.ClientID
With Script
.Append("<script language='javascript'>")
.Append("var toFind = ''; ")
.Append("var timeoutID = ''; ")
.Append("timeoutInterval = 250; ")
.Append("var timeoutCtr = 0; ")
.Append("var timeoutCtrLimit = 3 ; ")
.Append("var oControl = ''; ")
.Append("function listbox_onkeypress(){")
.Append("window.clearInterval(timeoutID);")
.Append("oControl = window.event.srcElement;")
.Append("var keycode = window.event.keyCode;")
.Append("if(keycode >= 32 ){")
.Append("var c = String.fromCharCode(keycode);")
.Append("c = c.toUpperCase(); ")
.Append("toFind += c ; ")
.Append("find(); ")
.Append("timeoutID = window.setInterval('idle()', timeoutInterval);
")
.Append("}")
.Append("}")
.Append("function listbox_onblur(){")
.Append("window.clearInterval(timeoutID);")
.Append("resetToFind();")
.Append("}")
.Append("function idle(){")
.Append("timeoutCtr += 1;")
.Append("if(timeoutCtr > timeoutCtrLimit){")
.Append("resetToFind();")
.Append("timeoutCtr = 0;")
.Append("window.clearInterval(timeoutID);")
.Append("}")
.Append("}")
.Append("function resetToFind(){")
.Append("toFind = '';")
.Append("}")
.Append("function find(){")
.Append("var allOptions = document.all.item(oControl.id);")
.Append("for (i=0; i < allOptions.length; i++){")
.Append("nextOptionText = allOptions(i).text.toUpperCase();")
.Append("if(!isNaN(nextOptionText) && !isNaN(toFind) ){")
.Append("nextOptionText *= 1; ")
.Append("toFind *= 1;")
.Append("}")
'// Does the next item match exactly what the user typed?
.Append("if(toFind == nextOptionText){")
'// OK, we can stop at this option. Set focus here
.Append("oControl.selectedIndex = i;")
.Append("window.event.returnValue = false;")
.Append("break;")
.Append("}")
'// If the string does not match exactly, find which two entries it
should be between.
.Append("if(i < allOptions.length-1){")
'// If we are not yet at the last listbox item, see if the search
string comes between the current
'// entry and the next one. If so, place the selection there.
.Append("lookAheadOptionText = allOptions(i+1).text.toUpperCase() ;")
.Append("if( (toFind > nextOptionText) && (toFind <
lookAheadOptionText) ){")
.Append("oControl.selectedIndex = i+1;")
.Append("window.event.cancelBubble = true;")
.Append("window.event.returnValue = false;")
.Append("break;")
.Append("}")
.Append("} ")
.Append("else{")
'// If we are at the end of the entries and the search string is
still higher
'// than the entries, select the last entry
.Append("if(toFind > nextOptionText){")
.Append("oControl.selectedIndex = allOptions.length-1; ")
.Append("window.event.cancelBubble = true;")
.Append("window.event.returnValue = false;")
.Append("break;")
.Append("}")
.Append("} ")
.Append("} ")
.Append("} ")
.Append("</script>")
End With
pgPage.RegisterStartupScript("ListControl", Script.ToString())
End Sub
like a winform dropdown box.
Let's say you want to find Steven. In a winform dropdown list, you type
"Ste" and you are on Steven. Press enter or tab, and away you go to the next
form field. But in a webform, when you type ste it does three things. First
it take you to Sam, then to Tammy, and finally to Eba. The script at the
bottom of this e-mail causes a webform dropdown to work like the first
example, a winform, not the second, a webform. Great!
Here is the problem. With this script it appears that the
dropdown_selectedIndexChanged event never gets raised. I need both the
modified functionality and the raised event to occur. The script follows for
your perusal.
What am I doing wrong?
Thanks in advance for your help.
Steven
Public Shared Sub sbListFind(ByRef pgPage As System.Web.UI.Page)
Dim Script As New System.Text.StringBuilder
'Dim ClientID As String = ListControl.ClientID
With Script
.Append("<script language='javascript'>")
.Append("var toFind = ''; ")
.Append("var timeoutID = ''; ")
.Append("timeoutInterval = 250; ")
.Append("var timeoutCtr = 0; ")
.Append("var timeoutCtrLimit = 3 ; ")
.Append("var oControl = ''; ")
.Append("function listbox_onkeypress(){")
.Append("window.clearInterval(timeoutID);")
.Append("oControl = window.event.srcElement;")
.Append("var keycode = window.event.keyCode;")
.Append("if(keycode >= 32 ){")
.Append("var c = String.fromCharCode(keycode);")
.Append("c = c.toUpperCase(); ")
.Append("toFind += c ; ")
.Append("find(); ")
.Append("timeoutID = window.setInterval('idle()', timeoutInterval);
")
.Append("}")
.Append("}")
.Append("function listbox_onblur(){")
.Append("window.clearInterval(timeoutID);")
.Append("resetToFind();")
.Append("}")
.Append("function idle(){")
.Append("timeoutCtr += 1;")
.Append("if(timeoutCtr > timeoutCtrLimit){")
.Append("resetToFind();")
.Append("timeoutCtr = 0;")
.Append("window.clearInterval(timeoutID);")
.Append("}")
.Append("}")
.Append("function resetToFind(){")
.Append("toFind = '';")
.Append("}")
.Append("function find(){")
.Append("var allOptions = document.all.item(oControl.id);")
.Append("for (i=0; i < allOptions.length; i++){")
.Append("nextOptionText = allOptions(i).text.toUpperCase();")
.Append("if(!isNaN(nextOptionText) && !isNaN(toFind) ){")
.Append("nextOptionText *= 1; ")
.Append("toFind *= 1;")
.Append("}")
'// Does the next item match exactly what the user typed?
.Append("if(toFind == nextOptionText){")
'// OK, we can stop at this option. Set focus here
.Append("oControl.selectedIndex = i;")
.Append("window.event.returnValue = false;")
.Append("break;")
.Append("}")
'// If the string does not match exactly, find which two entries it
should be between.
.Append("if(i < allOptions.length-1){")
'// If we are not yet at the last listbox item, see if the search
string comes between the current
'// entry and the next one. If so, place the selection there.
.Append("lookAheadOptionText = allOptions(i+1).text.toUpperCase() ;")
.Append("if( (toFind > nextOptionText) && (toFind <
lookAheadOptionText) ){")
.Append("oControl.selectedIndex = i+1;")
.Append("window.event.cancelBubble = true;")
.Append("window.event.returnValue = false;")
.Append("break;")
.Append("}")
.Append("} ")
.Append("else{")
'// If we are at the end of the entries and the search string is
still higher
'// than the entries, select the last entry
.Append("if(toFind > nextOptionText){")
.Append("oControl.selectedIndex = allOptions.length-1; ")
.Append("window.event.cancelBubble = true;")
.Append("window.event.returnValue = false;")
.Append("break;")
.Append("}")
.Append("} ")
.Append("} ")
.Append("} ")
.Append("</script>")
End With
pgPage.RegisterStartupScript("ListControl", Script.ToString())
End Sub