lenin
Nov 15th, 2000, 10:08 AM
Hi,
sorry for multiple questions this afternoon, but I have a deadline to complete a simple javascript. Essentally what I am doing is as the user types in a string to a text box it is compared with the contents of a select list box. What I need to know is, if a string match is found between my text box and a select list box entry then I want to select that element in the select list. So, for example, say I have the string
Leeds
and a list
London
Leeds
Liverpool
Belfast
When I find a match I want Leeds to be the selected option.
Mark Sreeves
Nov 15th, 2000, 01:49 PM
onKeyUp is probably ie only but try this:
I couln't be bothered to write a select manually so I used an array and a sort routine...
a bonus point if you can tell me what this set "regions" are!
<HTML>
<HEAD>
<script language=javascript>
function myBubbleSort(arrayName,length) {
for (var k=0; k<(length-1); k++)
for (var j=k+1; j<length; j++)
if (arrayName[j] < arrayName[k]) {
var dummy = arrayName[k];
arrayName[k] = arrayName[j];
arrayName[j] = dummy;
}
}
var regions = new Array(
"Worcester",
"Coventry",
"Gloucester",
"Bristol",
"Truro",
"Hull",
"Norwich",
"Middlesbrough",
"Sheffield",
"Nottingham",
"Swindon",
"Reading",
"Carlisle",
"Brighton",
"Chelmsford",
"Inverness",
"Peterborough",
"Shrewsbury",
"Cardiff",
"Leicester",
"Manchester",
"Newcastle-upon-Tyne",
"Northampton",
"Grimsby",
"Stoke-on-Trent",
"Liverpool",
"Luton",
"Ipswich",
"Bolton",
"Durham",
"Kirkwall",
"York",
"Preston",
"Oxford",
"Haverfordwest",
"London-NW",
"Chester",
"Bangor",
"Cambridge",
"Salisbury",
"Hereford",
"Plymouth",
"Huddersfield",
"Portsmouth",
"Ayr",
"Boston",
"Swansea",
"Birmingham",
"Dudley",
"Warrington",
"Newport-IOW",
"Glasgow",
"Exeter",
"Hastings",
"Kendal",
"Aberystwyth",
"Bournemouth",
"Barrow-in-Furness",
"Dundee",
"Lincoln",
"Canterbury",
"Edinburgh",
"London-SW",
"London-SE",
"Stornoway",
"Maidstone",
"Selkirk",
"Stirling",
"London-NE",
"Leeds",
"Stranraer",
"Guildford",
"Lerwick",
"Aberdeen",
"Oban",
"Keith",
"Wick",
"Dumfries",
"Barnstaple",
"Taunton",
"London-Central");
myBubbleSort(regions,regions.length);
function left(strIn,num)
{
var strOut = ""
for(k=0;k<num;k++)
{
strOut += strIn.charAt(k);
}
return strOut;
}
function fillList()
{
var oOption ;
for(k=0;k<regions.length;k++)
{
oOption = document.createElement("OPTION");
oOption.text=regions[k];
oOption.value=k;
document.frm1.select1.add(oOption);
}
}
function search()
{
var testString = document.frm1.txt1.value.toUpperCase();
var len = testString.length;
//
for(k = 0;k < regions.length;k++)
{
if(testString <= left(regions[k].toUpperCase(),len))
{
break;// exit the loop
}
}
document.frm1.select1.selectedIndex = k;
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad='fillList()'>
<form name=frm1>
<input name=txt1 onKeyup="search();"><br>
<select name=select1>
</select>
</form>
</BODY>
</HTML>
edited to change i variables to k to prevent italisizing
[Edited by Mark Sreeves on 11-15-2000 at 02:57 PM]
lenin
Nov 16th, 2000, 03:22 AM
Mark,
thanks v. much. I went for the following:
%>
<SCRIPT LANGUAGE="JavaScript">
<!--
function echoIt(whatever)
{
var t;
var list_length;
t = whatever.value; // Assign the text sring to a var from Textbox object
list_length = document.frm1.TownCombo.length; // Determine the length of the list box
for(var i=0; i < list_length; i++)
{
var compare_String; // Full String Compare
var compare_id; // Select list id
compare_String = frm1.TownCombo.options[i].text; // Full string compare text
compare_id = frm1.TownCombo.options[i].value; // Compare Text id
var outcome; // Return outcome
// indexOf checks for occurence of a partial string in another string
// returns 0 or greater if match found
outcome = compare_String.indexOf(t);
if ( outcome >= 0 )
{
frm1.TownCombo.selectedIndex = compare_id - 1; // listbox index is one less than compare_id
return -1;
};
}
}
filled select list from database, used keyup event.
Thanks
Lenin.
Mark Sreeves
Nov 16th, 2000, 04:37 AM
tidy solution
I expect you've already changed it but I reckon if(outcome >=0) ought to br if(outcome == 0 ) to make sure it only findes the enties starting with the text
and
I'd also put .toUpperCase() in the comparison so it isn't case sensitive
lenin
Nov 16th, 2000, 04:41 AM
Think you read my mind, especially for toupper addition.
Many thanks for the insight Mark. Just getting involved in Javascript at the moment, exciting area.
Lenin.
Mark Sreeves
Nov 16th, 2000, 04:49 AM
I love javascript!
I've recently been doing fairly large app using Server-Side Javascript on Netscape Enterprise Server and bucket-loads of client-side javascript.
I've got some VB to do today but it bores me senseless! :(