PDA

View Full Version : Javascript Selection Script Help


Rutworld
11-20-2002, 09:53 AM
I am having a problem with the following script. I wan the input entry to match the select box item exactly but it seems to be off by one number when typed into the input box.

Any input would be helpfull:)

Code:
<!--
<html>
<script>
//------------------------------------------------------------
//Find item in left select and highlight
//------------------------------------------------------------
function updateSelection() {
assyNumInput = document.getElementById('assemblyInput');
assyNum = assyNumInput.value;
assyNumLength = assyNum.length;
assyList = document.getElementById('assemblyItems');
i=0;
while(i<assyList.length && assyNum != assyList[i].text.substr(0,assyNum.length)) {
assyList.selectedIndex = 1;
i++;
}
assyList.selectedIndex = i;
}
</script>

<body>
<input id="assemblyInput" type="text" maxlength="20" size="20" value="" onKeyPress="updateSelection()">
<br>
<br>
<div id="assemblySelectView">
<select id="assemblyItems" size="15" class="assemblylist">
<option>102</option>
<option>10202</option>
<option>103</option>
<option>1030</option>
<option>104</option>
<option>1040</option>
</select>
</div>
</body>
</html>
-->

DCElliott
11-20-2002, 11:34 AM
Remember indexing starts at 0 not 1

Talveila
11-21-2002, 12:08 AM
Hi Rutworld,
Only one more remark: the last characterer inserted in the input text is not taken into account by your function. I think you should catch the last key stroked and append to the string.

<!--

function updateSelection()
{

assyNumInput = document.getElementById('assemblyInput');
assyNum = assyNumInput.value+String.fromCharCode(event.keyCode);


..............
-->

Rutworld
11-21-2002, 05:33 AM
I had to use a combination of both of your replies since I need this to work with NS also.

I appreciate the fast responses and will try to help out as much as I can with with other users requests.

Enjoy the holidays!

Talveila
11-22-2002, 12:31 AM
Hi again,
A proposed solution for ie and ns

<!--

<html>
<script>
//------------------------------------------------------------
//Find item in left select and highlight
//------------------------------------------------------------
function updateSelection(e)
{
if(document.layers)
{
letter = String.fromCharCode(e.which);
} else
{
letter = String.fromCharCode(event.keyCode);
}

assyNumInput = document.forms[0].elements['assemblyInput'];
assyNum = assyNumInput.value+letter;
assyNumLength = assyNum.length;
assyList = document.forms[0].elements['assemblyItems'];
found = -1;
j= 0;
assyList.selectedIndex = -1;
while(j<assyList.length && (found == -1) ) {
if(assyNum == assyList[j].text.substr(0,assyNum.length)) found = j;
j++;
}
if ( found != -1) assyList.selectedIndex = found;
}
</script>

<body>
<form>
<input name="assemblyInput" type="text" maxlength="20" size="20" value="" onKeyPress="updateSelection(event)">
<br>
<br>

<select name="assemblyItems" size="15" class="assemblylist">
<option>ab</option>
<option>abc</option>
<option>abcd</option>
<option>b</option>
<option>bc</option>
<option>fg</option>
</select>
</form>

</body>
</html>

-->