marjKrug
asked on
updating form data from imageMap onClick()
Hi,here is my javascript problem:
I have 2 windows, say W1 and W2.
W1 is an opener for W2 and passes variables to W2.
W2 contains a listbox and checkboxes, with the number of checkboxes changing for each listbox selection. That is done by storing the variables passed to W2 in the opener (W1).
I now want to add an image Map to W1, with the clickable locations on the map enabling me to do the same as changing the selection in the listbox.
Hope that it is all making sense. Any suggestions??
I have 2 windows, say W1 and W2.
W1 is an opener for W2 and passes variables to W2.
W2 contains a listbox and checkboxes, with the number of checkboxes changing for each listbox selection. That is done by storing the variables passed to W2 in the opener (W1).
I now want to add an image Map to W1, with the clickable locations on the map enabling me to do the same as changing the selection in the listbox.
Hope that it is all making sense. Any suggestions??
ASKER
Hi,
The number of checkboxes is changed using an array of 0 and 1 which allows the checkbox selection to change according to the selection in the list.
The click on the map needs to change the listbox as well as the checkboxes.
Here is my code
In W1 (the opener) I have
function newWindow()
{
id = 0;
mywindow=open('datachoice. htm','myna me','resiz able=no,wi dth=250,he ight=310') ;
mywindow.location.href = 'datachoice.htm'; if (mywindow.opener == null)
mywindow.opener = self;
}
with a button to generate W2 (the second window)
<input TYPE="button" VALUE="Show Stations" onClick="newWindow()">
In my second window I have in the header the script:
function makeWin(id)
{
datatype = new Array("curent","wave","wat erlevel"," ctd");
station = new Array()
// initialises available data within station (0 = boolean for no data)
station[0] = new Array(1,1,0,1)
station[1] = new Array(1,1,1,1)
station[2] = new Array(1,1,1,1)
station[3] = new Array(0,1,1,1)
station[4] = new Array(0,0,0,0)
// Put all the the form object in the output string and use document.write.output in main body of document
output = '<p><h3>Please click on a station to select data:</h3></p> ';
output+= '<form name="dataform">';
output+='<select name="stationchoice" onChange = "getId()" >';
// Creates list box for station selection
for (var j=0;j<station.length;j++)
{
if (j==id)
{output+='<option value=""+id+"" SELECTED>station '+ (j+1) +""+'</option>';}
else
{output+='<option value = ""+id+"" >station '+ (j+1) +""+'</option>';}
}
output+="</select><br>";
// Creates checkboxes for data selection
for (var j=0;j<datatype.length;j++)
{
if (station[id][j] == 1)
{output+='<p><input type = checkbox name = "datachoice">' +datatype[j];}
}
output+='<p><input type=button value="View Choice" onClick="viewChoice()" >';
output+='</form>';
return output;
}
function getId()
{
opener.id =document.dataform.station choice.sel ectedIndex ;
location.href = "datachoice.htm";
}
in the body:
document.write(makeWin(ope ner.id));
-------------------
The number of checkboxes is changed using an array of 0 and 1 which allows the checkbox selection to change according to the selection in the list.
The click on the map needs to change the listbox as well as the checkboxes.
Here is my code
In W1 (the opener) I have
function newWindow()
{
id = 0;
mywindow=open('datachoice.
mywindow.location.href = 'datachoice.htm'; if (mywindow.opener == null)
mywindow.opener = self;
}
with a button to generate W2 (the second window)
<input TYPE="button" VALUE="Show Stations" onClick="newWindow()">
In my second window I have in the header the script:
function makeWin(id)
{
datatype = new Array("curent","wave","wat
station = new Array()
// initialises available data within station (0 = boolean for no data)
station[0] = new Array(1,1,0,1)
station[1] = new Array(1,1,1,1)
station[2] = new Array(1,1,1,1)
station[3] = new Array(0,1,1,1)
station[4] = new Array(0,0,0,0)
// Put all the the form object in the output string and use document.write.output in main body of document
output = '<p><h3>Please click on a station to select data:</h3></p> ';
output+= '<form name="dataform">';
output+='<select name="stationchoice" onChange = "getId()" >';
// Creates list box for station selection
for (var j=0;j<station.length;j++)
{
if (j==id)
{output+='<option value=""+id+"" SELECTED>station '+ (j+1) +""+'</option>';}
else
{output+='<option value = ""+id+"" >station '+ (j+1) +""+'</option>';}
}
output+="</select><br>";
// Creates checkboxes for data selection
for (var j=0;j<datatype.length;j++)
{
if (station[id][j] == 1)
{output+='<p><input type = checkbox name = "datachoice">' +datatype[j];}
}
output+='<p><input type=button value="View Choice" onClick="viewChoice()" >';
output+='</form>';
return output;
}
function getId()
{
opener.id =document.dataform.station
location.href = "datachoice.htm";
}
in the body:
document.write(makeWin(ope
-------------------
Be aware that "id" is a reserved keyword in HTML! You should find a different vairable name, eg stationid
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
gator4life is correct about the newWindow() function. There is no point in duplicating code unnecessarily.
ASKER
OK.Thanks for the tips!
No comment has been added lately, so it's time to clean up this TA.
I will leave the following recommendation for this question in the Cleanup topic area:
Accept: gator4life {http:#8086783}
Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!
jAy
EE Cleanup Volunteer
I will leave the following recommendation for this question in the Cleanup topic area:
Accept: gator4life {http:#8086783}
Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!
jAy
EE Cleanup Volunteer
gator4life
(chomp, chomp)