I'm attempting to generate a table using JavaScript
Here's the HTML for the table:
<table id="rounded" runat=server summary="2007 Major IT Companies' Profit" style="position:relative;left:-45px;" >
<tr>
<th scope="col" class="rounded-company">header1</th>
<th scope="col" class="rounded-q1">header2</th>
<th scope="col" class="rounded-q1">header3</th>
<th scope="col" class="rounded-q1">header4</th>
<th scope="col" class="rounded-q1">header5</th>
<th scope="col" class="rounded-q1">header6</th>
<th scope="col" class="rounded-q1">header7</th>
<th scope="col" class="rounded-q1">header8</th>
<th scope="col" class="rounded-q1">header9</th>
<th scope="col" class="rounded-q4"> header10</th>
</tr>
</table>
The table data is fetched using AJAX, resulting in this updated table layout:
<table id="rounded" runat=server summary="2007 Major IT Companies' Profit" style="position:relative;left:-45px;" >
<tr>
<th scope="col" class="rounded-company">header1</th>
<th scope="col" class="rounded-q1">header2</th>
<th scope="col" class="rounded-q1">header3</th>
<th scope="col" class="rounded-q1">header4</th>
<th scope="col" class="rounded-q1">header5</th>
<th scope="col" class="rounded-q1">header6</th>
<th scope="col" class="rounded-q1">header7</th>
<th scope="col" class="rounded-q1">header8</th>
<th scope="col" class="rounded-q1">header9</th>
<th scope="col" class="rounded-q4"> header10</th>
</tr>
<tr>
<td>value1</td>
<td>value2</td>
<td>value3</td>
<td>value4</td>
<td></td>
<td>value6</td>
<td>value7</td>
<td>value8</td>
<td>value9</td>
<td>value10</td>
</tr>
<tr>
<td>value1</td>
<td>value2</td>
<td>value3</td>
<td>value4</td>
<td></td>
<td>value6</td>
<td>value7</td>
<td>value8</td>
<td>value9</td>
<td>value10</td>
</tr>
</table>
My script for printing the table looks like this:
<script type="text/javascript">
function printTable()
{
var disp_setting = "toolbar=yes,location=no,directories=yes,menubar=yes,";
disp_setting += "scrollbars=yes,width=1350, height=800";
var content_vlue = $("#rounded").html();
var docprint = window.open("", "", disp_setting);
docprint.document.open();
docprint.document.write('<link href="css/table2.css" type="text/css" rel="stylesheet" />');
docprint.document.write('<html><head><title>Inel Power System</title>');
docprint.document.write('</head><body onLoad="self.print()"><center>');
docprint.document.write(content_vlue);
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.focus();
}
</script>
The issue I'm facing is that the printed table appears as text only, without rows or columns. When printing directly from the page source (without using AJAX), everything works correctly.
If anyone has any insights or solutions, I would greatly appreciate it. Thank you!