Forum Moderators: open
<TR>
<TD >Person Name</TD>
<TD >Person Company</TD>
<TD >Person Title</TD>
<TD>Street Address</TD>
<TD ><div align="center"><a href="http://maps.yahoo.com/maps_result?addr=current-table-row.cell[4]&csz=current-table-row.cell[8]" target="_blank"><img src="images/mapbutton.jpg" width="16" height="12" border="0"></a></div></TD>
<TD >City</TD>
<TD >State</TD>
<TD >Zip</TD>
<TD >Phone</TD>
</TR>
Ideally above would create a button that would open a new window which would get a Yahoo map using the persons address and zip... if I could get the?addr=current-table-row.cell[4]&csz=current-table-row.cell[8] correct in the url. I've tried several HTML DOM methods without success. Perhaps someone can help?
<html>
<head>
<script language ="JavaScript">
function fillTableLinks()
{
var address;
var zip;
var i;
for (i=1; i<document.getElementById('myTable').rows.length; i++)
{
address = document.getElementById('myTable').rows[i].cells[3].childNodes[0].data;
zip = document.getElementById('myTable').rows[i].cells[6].childNodes[0].data;
var map_cell = document.createElement('td');
var link = document.createElement('a');
link.setAttribute('href', 'http://maps.yahoo.com/maps_result?addr=' + address + '&csz=' + zip);
link.setAttribute('target', '_blank');
var image = document.createElement('img');
image.setAttribute('src', 'images/mapbutton.jpg');
link.appendChild(image);
map_cell.appendChild(link);
document.getElementById('myTable').rows[i].appendChild(map_cell);
}
}
</script>
<body onload=fillTableLinks()>
<table>
<tbody id = "myTable">
<TR>
<TD >Person Name</TD>
<TD >Person Company</TD>
<TD >Person Title</TD>
<TD>Street Address</TD>
<TD >City</TD>
<TD >State</TD>
<TD >Zip</TD>
<TD >Phone</TD>
<td>Map</td>
</TR>
<tr>
<td>Joe Bloggs</td>
<td>Bloggs Inc.</td>
<td>Mr</td>
<td>9301 S Santa Monica Blvd</td>
<td>Beverly Hills</td>
<td>CA</td>
<td>90210</td>
<td>12345678</td>
</tr>
</tbody>
</table>
</body>
</html>
It dynamically creates the cell with the link and image inside, and attaches it to the end of the relevant row. Of course, if you really need it to be in a certain position, you can add an empty <td> in each row of the html table and dynamically create the link and image elements to append to that <td>.
Hope this is what you needed!
Jon
