K
karflips33
A user of mine wanted to copy and paste single columns from an existing
HTML table in a webpage into an excel spreadsheet. You can't do this by
clicking and dragging the mouse over a column - it selects the whole
html table.
I worked up the following code and thought someone else might benefit.
My approach involves changing the table structure slightly. (click on
column headers to select the row):
<html>
<head>
<script>
function ControlRangeSelect(intColumn, intRows) {
if (intRows > 0)
{
for(var i=1;i<=intRows;i++)
{
eval("var r" + i + " = document.body.createTextRange()")
eval("r" + i + ".moveToElementText(document.getElementById('div" +
intColumn + i + "'))");
}
eval("r1.setEndPoint('EndToEnd', r" + intRows + ")");
r1.select();
}
}
</script>
</head>
<body>
<table>
<td>
<table>
<tr><td onClick="ControlRangeSelect(1,3);">col1</td>
<tr><td><div id=div11>col1</div></td>
<tr><td><div id=div12>col1</div></td>
<tr><td><div id=div13>col1</div></td>
</table>
</td>
<td>
<table>
<tr><td onClick="ControlRangeSelect(2,3);">col2</td>
<tr><td><div id=div21>col2</div></td>
<tr><td><div id=div22>col2</div></td>
<tr><td><div id=div23>col2</div></td>
</table>
</td>
<td>
<table>
<tr><td onClick="ControlRangeSelect(3,3);">col3</td>
<tr><td><div id=div31>col3</div></td>
<tr><td><div id=div32>col3</div></td>
<tr><td><div id=div33>col3</div></td>
</table>
</td>
<td>
<table>
<tr><td onClick="ControlRangeSelect(4,3);">col4</td>
<tr><td><div id=div41>col4</div></td>
<tr><td><div id=div42>col4</div></td>
<tr><td><div id=div43>col4</div></td>
</table>
</td>
</table>
</body>
</html>
HTML table in a webpage into an excel spreadsheet. You can't do this by
clicking and dragging the mouse over a column - it selects the whole
html table.
I worked up the following code and thought someone else might benefit.
My approach involves changing the table structure slightly. (click on
column headers to select the row):
<html>
<head>
<script>
function ControlRangeSelect(intColumn, intRows) {
if (intRows > 0)
{
for(var i=1;i<=intRows;i++)
{
eval("var r" + i + " = document.body.createTextRange()")
eval("r" + i + ".moveToElementText(document.getElementById('div" +
intColumn + i + "'))");
}
eval("r1.setEndPoint('EndToEnd', r" + intRows + ")");
r1.select();
}
}
</script>
</head>
<body>
<table>
<td>
<table>
<tr><td onClick="ControlRangeSelect(1,3);">col1</td>
<tr><td><div id=div11>col1</div></td>
<tr><td><div id=div12>col1</div></td>
<tr><td><div id=div13>col1</div></td>
</table>
</td>
<td>
<table>
<tr><td onClick="ControlRangeSelect(2,3);">col2</td>
<tr><td><div id=div21>col2</div></td>
<tr><td><div id=div22>col2</div></td>
<tr><td><div id=div23>col2</div></td>
</table>
</td>
<td>
<table>
<tr><td onClick="ControlRangeSelect(3,3);">col3</td>
<tr><td><div id=div31>col3</div></td>
<tr><td><div id=div32>col3</div></td>
<tr><td><div id=div33>col3</div></td>
</table>
</td>
<td>
<table>
<tr><td onClick="ControlRangeSelect(4,3);">col4</td>
<tr><td><div id=div41>col4</div></td>
<tr><td><div id=div42>col4</div></td>
<tr><td><div id=div43>col4</div></td>
</table>
</td>
</table>
</body>
</html>