ASP.NET Dropdownlist

  • Thread starter Thread starter Kevin Quigley
  • Start date Start date
K

Kevin Quigley

Hi,

I am writing to ask if anyone knows if it is possible to create a
dynamic, searchable dropdownlist in ASP.Net.

I have a questionnaire with a dropdownlist that is populated with a list
of countries from a database table. I want to the user to be able to
type the first few letters of the country and for the ddl to jump to the
countries that begin with the letters typed in.

Any help / info on this subject would be much appreciated.

Thanks,
Kevin.
 
Try this JavaScript method..(works for a listbox)

call "return SmartSearch_ListKeyDown(this);" in your
keydown event of the control and you get fast searching.

The JavaScript (based on a variety of newsgroup postings)..

//=========================================================
===
// Perform a binary search on a selectbox and return the
index
// of a match
function SmartSelect(searchString, oSelect)
{
var sInput = String(searchString).toUpperCase();
var iLength = sInput.length;

if (iLength <= 0)
return -1;

var oOptions = oSelect.options;
var i, diff, bFound, sTemp;

var iHigh = oOptions.length - 1;
var iLow = 0;
var iCurrent = Math.floor((iHigh + 1) / 2);

bFound = false;
do
{
// Get the current option

sTemp = oOptions(iCurrent).text.toUpperCase();
var sSubstr = sTemp.substr(0, iLength);

if (sSubstr < sInput)
{
// Search the upper half of the branch
iLow = iCurrent + 1;
}
else if (sSubstr > sInput)
{
// Search the lower half of the branch
iHigh = iCurrent - 1;
}
else
{
bFound = true;
break;
}

// Pick the middle of the branch again
iCurrent = Math.floor(iLow + ((iHigh + 1) - iLow) / 2);

} while (iHigh >= iLow)

// Is there a better prefix match?
if (iLength < sTemp.length)
{
// Store the current old value
var iOld = iCurrent--;

// Now go back until we find one that doesn't match the
prefix
while (iCurrent >= 0)
{
// Gone too far -- the prefix no longer matches.
if (oOptions(iCurrent).value.toUpperCase().substr(0,
iLength) != sInput)
break;

iOld = iCurrent--;
}

iCurrent = iOld;
}

if (bFound)
return iCurrent;
else
return -1;
}


//====================================================
//Some globals
var searchString="";
var lastSearch="";
var lastObjID="";

//====================================================
//Reset the search string if it has not been changed in the
//last 2 seconds
function ClearSearchString()
{
date= new Date();
var tdiff= date.valueOf() - lastSearch;

if(tdiff<1000*2)
{
setTimeout("ClearSearchString();",1000);
}
else
{
searchString="";
}
}
//=========================================================
===============
//Pulse the selection of particular item within a listbox
which has
//the affect of scrolling to that item
function PulseSelection(oOption)
{
var bSelected=oOption.selected;

oOption.selected=false;
oOption.selected=true;
oOption.selected=bSelected;
}
//=========================================================
===============
//Called whenever a key is pressed to provide dynamic
searching on an object
function SmartSearch_ListKeyDown(lb)
{
if(lastObjID!=lb.id)
{ //we're searching a different control so
reset search string
lastObjID=lb.id;
ClearSearchString();
}

//check for any 'special' keys and pass them
through to the object to handle
switch(event.keyCode)
{
case 32:
if(searchString.length<=0)return
true;//space key
break;
case 38://cursor up
case 40://cursor down
return true;
}

searchString += String.fromCharCode(event.keyCode);

var i = SmartSelect( searchString, lb);
if(i>=0)
{
PulseSelection(lb.options);
date= new Date();
lastSearch = date.valueOf();
}

setTimeout("ClearSearchString();",1000);

return(false);//return false to stop default
keypress functionality
}
//===============================================
 
Hi,

Thanks for the reply.

Could you tell me what web controls provide the keydown event.

Thanks Again.
 
Add the logic to your controls within ASP.Net

MyListbox.Attributes.Add("onkeydown", "return
SmartSearch_ListKeyDown(this);");

Note: All the actual logic and events are javascript based
not .Net.
-----Original Message-----
Try this JavaScript method..(works for a listbox)

call "return SmartSearch_ListKeyDown(this);" in your
keydown event of the control and you get fast searching.

The JavaScript (based on a variety of newsgroup postings)..
//========================================================
=
===
// Perform a binary search on a selectbox and return the
index
// of a match
function SmartSelect(searchString, oSelect)
{
var sInput = String(searchString).toUpperCase();
var iLength = sInput.length;

if (iLength <= 0)
return -1;

var oOptions = oSelect.options;
var i, diff, bFound, sTemp;

var iHigh = oOptions.length - 1;
var iLow = 0;
var iCurrent = Math.floor((iHigh + 1) / 2);

bFound = false;
do
{
// Get the current option

sTemp = oOptions(iCurrent).text.toUpperCase();
var sSubstr = sTemp.substr(0, iLength);

if (sSubstr < sInput)
{
// Search the upper half of the branch
iLow = iCurrent + 1;
}
else if (sSubstr > sInput)
{
// Search the lower half of the branch
iHigh = iCurrent - 1;
}
else
{
bFound = true;
break;
}

// Pick the middle of the branch again
iCurrent = Math.floor(iLow + ((iHigh + 1) - iLow) / 2);

} while (iHigh >= iLow)

// Is there a better prefix match?
if (iLength < sTemp.length)
{
// Store the current old value
var iOld = iCurrent--;

// Now go back until we find one that doesn't match the
prefix
while (iCurrent >= 0)
{
// Gone too far -- the prefix no longer matches.
if (oOptions(iCurrent).value.toUpperCase().substr(0,
iLength) != sInput)
break;

iOld = iCurrent--;
}

iCurrent = iOld;
}

if (bFound)
return iCurrent;
else
return -1;
}


//====================================================
//Some globals
var searchString="";
var lastSearch="";
var lastObjID="";

//====================================================
//Reset the search string if it has not been changed in the
//last 2 seconds
function ClearSearchString()
{
date= new Date();
var tdiff= date.valueOf() - lastSearch;

if(tdiff<1000*2)
{
setTimeout("ClearSearchString();",1000);
}
else
{
searchString="";
}
}
//======================================================== =
===============
//Pulse the selection of particular item within a listbox
which has
//the affect of scrolling to that item
function PulseSelection(oOption)
{
var bSelected=oOption.selected;

oOption.selected=false;
oOption.selected=true;
oOption.selected=bSelected;
}
//======================================================== =
===============
//Called whenever a key is pressed to provide dynamic
searching on an object
function SmartSearch_ListKeyDown(lb)
{
if(lastObjID!=lb.id)
{ //we're searching a different control so
reset search string
lastObjID=lb.id;
ClearSearchString();
}

//check for any 'special' keys and pass them
through to the object to handle
switch(event.keyCode)
{
case 32:
if(searchString.length<=0)return
true;//space key
break;
case 38://cursor up
case 40://cursor down
return true;
}

searchString += String.fromCharCode(event.keyCode);

var i = SmartSelect( searchString, lb);
if(i>=0)
{
PulseSelection(lb.options);
date= new Date();
lastSearch = date.valueOf();
}

setTimeout("ClearSearchString();",1000);

return(false);//return false to stop default
keypress functionality
}
//===============================================



.
 
Hi,

Thanks a lot, I got it working and it works quite well. A handy little
piece of code.

Thanks again.

Kevin.
 
Back
Top