Inserting THEAD element into embedded HTML using jQuery
Posted
by robalot
on Stack Overflow
See other posts from Stack Overflow
or by robalot
Published on 2010-06-16T15:39:03Z
Indexed on
2010/06/16
15:42 UTC
Read the original article
Hit count: 512
I'm trying to use jQuery to insert HTML into a table element. I've been messing variations of the selector (below) with no luck. Can someone help me?
My Selector:
$j('#ctl00_body_gridData_dom').children('table:first').append("<thead><tr><td colspan='6'> </td><td align='center' colspan='7'>EM SPECS</td><td align='center' colspan='7'>FISH</td><td colspan='11'> </td></tr></thead>");
Here's what I am trying to do...
I want to insert this:
<thead>
<tr>
<td colspan="6">
</td>
<td align="center" colspan="7">
EM SPECS
</td>
<td align="center" colspan="7">
FISH
</td>
<td colspan="11">
</td>
</tr>
</thead>
The sample below is what I want the end result to look like...
So It Looks Like This: Jquery Event Pool
<table id="ctl00_body_gridData" style="width: 2000px; -moz-user-select: none;" border="1" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td id="ctl00_body_gridData_dom" class="GridData" style="vertical-align: top; height: 245px;" valign="top">
<table style="width: 100%;" border="0" cellpadding="0" cellspacing="0">
<thead>
<tr>
<td colspan="6">
</td>
<td align="center" colspan="7">
EM SPECS
</td>
<td align="center" colspan="7">
FISH
</td>
<td colspan="11">
</td>
</tr>
</thead>
<tbody>
<tr id="ctl00_body_gridData_top_head" class="headerlineGrid">
<td width="16">
<div style="width: 16px;"></div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,4,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,4,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,0,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,4,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,4,0)" style="width: 89px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 89px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Work<br>Package</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,6,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,6,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,1,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,6,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,6,0)" style="width: 62px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 62px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Work<br>Order</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,9,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,9,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,2,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,9,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,9,0)" style="width: 66px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 66px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
FCR<br>Group</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,12,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,12,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,3,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,12,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,12,0)" style="width: 105px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 105px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">Contractor</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,15,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,15,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,4,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,15,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,15,0)" style="width: 159px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 159px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Capital/Expense<br>Group</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,19,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,19,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,5,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,19,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,19,0)" style="width: 99px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 99px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">Cost Type</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,20,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,20,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,6,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,20,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,20,0)" style="width: 81px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 81px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Commit<br>Dollars</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,21,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,21,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,7,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,21,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,21,0)" style="width: 81px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 81px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Commit<br>Hours</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,22,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,22,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,8,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,22,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,22,0)" style="width: 86px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 86px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Commit<br>Quantity</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,23,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,23,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,9,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,23,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,23,0)" style="width: 76px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 76px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Control<br>Budget</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,24,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,24,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,10,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,24,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,24,0)" style="width: 46px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 46px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">FTC</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,25,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,25,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,11,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,25,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,25,0)" style="width: 88px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 88px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Total<br>Forecast</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,26,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,26,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,12,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,26,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,26,0)" style="width: 50px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 50px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Ctr<br>COB</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,27,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,27,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,13,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,27,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,27,0)" style="width: 49px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 49px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Ctr<br>CCB</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,28,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,28,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,14,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,28,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,28,0)" style="width: 81px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 81px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Ctr<br>
Commit<br>$</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,29,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,29,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,15,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,29,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,29,0)" style="width: 81px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 81px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Ctr<br>
Commit<br>Hours</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,30,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,30,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,16,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,30,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,30,0)" style="width: 86px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 86px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Ctr<br>
Commit<br>Quantity</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,31,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,31,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,17,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,31,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,31,0)" style="width: 95px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 95px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Ctr<br>% Compl.</td>
</tr>
</tbody>
</table>
</div>
</td>
<td onclick="ctl00_body_gridData.ClickHandler(event,this,32,0)" ondblclick="ctl00_body_gridData.DblClickHandler(event,null,32,0)" onmousemove="ctl00_body_gridData.MoveHandler(event,this,18,0)" onmouseover="ctl00_body_gridData.OverHandler(event,this,0)" onmouseout="ctl00_body_gridData.OutHandler(event,this,0)" onmousedown="ctl00_body_gridData.DownHandler(event,this,32,0)" onmouseup="ctl00_body_gridData.UpHandler(event,this,32,0)" style="width: 105px;" class="HeadingCell" align="center">
<div style="text-align: center; overflow: hidden; width: 105px;">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="white-space: nowrap; text-align: center;" class="HeadingCellText" align="center">
Contractor<br>CFTC</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<tr>
<td id="ctl00_body_gridData_expcolgrp_0" width="16" align="center"></td>
<td class="GroupHeading" colspan="20">
FCR<br>Group: Engineering</td>
</tr>
<tr>
<td id="ctl00_body_gridData_expcolgrp_1" width="16" align="center"></td>
<td class="GroupHeading" colspan="20">
FCR<br>Group: Pipe</td>
</tr>
<tr>
<td id="ctl00_body_gridData_expcolgrp_2" width="16" align="center"></td>
<td class="GroupHeading" colspan="20">
FCR<br>Group: Concrete</td>
</tr>
<tr>
<td id="ctl00_body_gridData_expcolgrp_3" width="16" align="center"></td>
<td class="GroupHeading" colspan="20">
FCR<br>Group: Insulation</td>
</tr>
<tr>
<td id="ctl00_body_gridData_expcolgrp_4" width="16" align="center"></td>
<td class="GroupHeading" colspan="20">
FCR<br>Group: Buildings</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
© Stack Overflow or respective owner