How to mouseover a row in a dynamic javascript table?
Dear all,
I created a table in javascript that populates values from an existing excel spreadsheet. Now I need to be able to mouseover the rows to trigger further events. I am able to change properties of the whole table, but not the rows.
Please help!
Thank you!
sample script:
<html>
<head>
<!-------------css props--------------------------->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style type="text/css">
.mytable {
border:1px solid #000000;
border-collapse:collapse;
width:200px;
}
.mytable td{
background:white;
border:1px solid #000000;
}
</style>
<!----------- JAVA SCRIPT --------------------------->
<script language="javascript" script type="text/javascript">
onload=function()
{
var Excel = new ActiveXObject("Excel.Application");
var Excel_File = Excel.Workbooks.Open("C:\\test.xlsx");
Excel.visible = true;
var i=1; // Column
var l=1; // Row
var Cell_Value;
var Row_Count, Col_Count, row, cell;
Row_Count = Excel_File.ActiveSheet.UsedRange.Rows.Count;
Col_Count = Excel_File.ActiveSheet.UsedRange.Columns.Count;
var root1 =document.getElementById('mydiv');
var tab=document.createElement("TABLE");
tab.className="mytable";
var tbo=document.createElement('tbody');
///////////////LOOP Retrieve Excel Values//////////////////
for (l=1; l<=Row_Count; l++)
{
row=document.createElement('tr');
for (i=1; i<=Col_Count; i++)
{
var a = Get_Cell_Value();
cell=document.createElement('td');
cell.appendChild(document.createTextNode(" " + a + " "));
row.appendChild(cell);
//document.write(a + " ");
}
tbo.appendChild(row);
}
/////////////// END LOOP Retrieve Excel Values////////////
Excel.application.quit();
tab.appendChild(tbo);
root1.appendChild(tab);
/////////////// Function gets Excel Cell Values //////////////////
function Get_Cell_Value()
{
Cell_Value = Excel_File.ActiveSheet.Cells(l,i).Value;
return Cell_Value;
}
/////////////// END Function gets Excel Cell Values //////////////
}
</script>
<!-----END------ JAVA SCRIPT ------------------------->
</head>
<body>
<div id="mydiv" onmouseover="document.getElementById('mydiv').style.backgroundColor='Blue';" onmouseout="document.getElementById('mydiv').style.backgroundColor='White';">
</div>
</body>
</html>
Thread Information
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Posting Permissions
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
Forum Rules
Bookmarks