Forum Moderators: open
I need to modify this code which works for one row to work with 10 rows on the form.
<HTML>
<HEAD>
<TITLE>Parallel Array Lookup</TITLE>
<SCRIPT LANGUAGE="JavaScript">
// the data
var UsageCsaId = new Array("ABERDEEN","AGOURA","AGUADILLA","AKRON");
var originalCompany = new Array("6410","8728","1260","6613");
// do the lookup into parallel arrays
function getData(form) {
var i = form.UsageCsaId.selectedIndex
form.OriginalCompanyCode.value = originalCompany[i]
}
</SCRIPT>
</HEAD>
<BODY onLoad="getData(document.frmMaintenance)">
<FORM NAME="frmMaintenance">
<SELECT NAME="UsageCsaId" onChange="getData(this.form)">
<OPTION>ABERDEEN
<OPTION>AGOURA
<OPTION>AGUADILLA
<OPTION>AKRON
</SELECT>
<INPUT TYPE="text" NAME="OriginalCompanyCode" SIZE=4 readonly>
</BODY>
</HTML>
Any help is greatly appreciated.
Thanks,
Issac
Would it be possible to give an example of what you mean by "10 rows" _?
Do you mean there will be 10*(selectBox + inputBox) _?
Is the information the same, or does each select/input pair have it's own parallel array pair for data _?
Can you change the data format _? (eg combine the array pairs into one single map).
---------------------------------
Is there any reason this info can't be put into the value attribute of each option element?
<option value="6410">ABERDEEN
..or would this cause unnecessary repetition?
>>Do you mean there will be 10*(selectBox + inputBox) _?
Yes, there will be 10 selects and inputBoxes (there are other fields within each row, but these are the only two that are related.
>>Is the information the same, or does each >>select/input pair have it's own parallel array pair >>for data _?
Yes, each row will have the same options in the selectBox and related inputBox
>>Can you change the data format _? (eg combine the >>array pairs into one single map).
Yes, the format can change. Actually, I need to build the array dynamically through BC4J/Java as the values will be coming from a database. It may be easier to create an array such as this: array[0] = new Array("ABERDEEN","6410"); How would I call the function if it were this way?
>>Is there any reason this info can't be put into the >>value attribute of each option element?
>><option value="6410">ABERDEEN
>>..or would this cause unnecessary repetition?
This would not work as the value for the selectBox needs to be what is in the text value. The inputBox is actually readonly and is there for display purposes
Issac
The only one I'm still uncertain about is why the info can't be kept in the value attributes. Then again, considering this would involve 10x duplication of the info. Maybe we should forget about that.
Sorry to come back with another couple of questions...
This is possible as it stands. However, the task can be less complicated if certain things are allowed. The central issue is how to identify and reference the appropriate input box.
* Do all the input boxes have the same name, or can they be different?
<HTML>
<HEAD>
<TITLE>Parallel Array Lookup</TITLE>
<SCRIPT src="start.js" type="text/javascript"></SCRIPT>
</HEAD>
<BODY>[red]<!--onload added via script -->[/red]
<FORM NAME="frmMaintenance">
<SELECT NAME="UsageCsaId">
<OPTION>ABERDEEN
<OPTION>AGOURA
<OPTION>AGUADILLA
<OPTION>AKRON
</SELECT>
<INPUT TYPE="text" NAME="OriginalCompanyCode" SIZE=4 readonly><SELECT NAME="UsageCsaId">[red]<!-- onchange added via script -->[/red]
<OPTION>ABERDEEN
<OPTION>AGOURA
<OPTION>AGUADILLA
<OPTION>AKRON
</SELECT>
<INPUT TYPE="text" NAME="OriginalCompanyCode" SIZE=4 readonly>
</FORM>
</BODY>
</HTML>[b]The SCRIPT[/b]---------(data.js)--------------------------------------
// the data
var UsageCsaId = new Array("ABERDEEN","AGOURA","AGUADILLA","AKRON");
var originalCompany = new Array("6410","8728","1260","6613");window.onload = function()
{
initForm( document.getElementsByName('frmMaintenance')[0] )
}function initForm(form)
{
var select, input, k=-1;
var selects = form.elements.UsageCsaId;
var inputs = form.elements.OriginalCompanyCode;while(select=selects[++k]){
select.input = inputs[k];
select.onchange = showData;
showData(select);
}
}// called globally first (with arg)
// then as method of select elm (no arg)
function showData(select)
{
select = select¦¦this;
select.input.value = getData(select);
}function getData(select)
{
return originalCompany[select.selectedIndex];
}--------------------------------------------------------------------------
Here's two choices of data format and associated implementation of
getData. First, my favoured, Using an object to map names to numbers:
[pre]
var data =
{
ABERDEEN : 6410,
AGOURA : 8728,
AGUADILLA : 1260,
AKRON : 6613
};function getData(select)
{
return data[select.options[select.selectedIndex].text];
}
[/pre]
* About quoting: In this case, neither the 'name',nor 'value' component need be quoted, unless..
The name needs to be quoted if it wouldn't pass the usual rules about variable names.
The value will need to be quoted if it contains leading zeros.
If in doubt, quote them all.
Now the other option. Your suggestion of a '2D' array:
[pre]
var data =
[
['ABERDEEN' , 6410],
['AGOURA' , 8728],
['AGUADILLA' , 1260],
['AKRON' , 6613]
];function getData(select)
{
return data[select.selectedIndex][1];
}
[/pre]
When 1 record returns, I get the following error: 'input' is null or not an object.