Allan, I'm back, but oh, so close....
That's my table. NOTICE I details row....<td id="alertDetails" colspan="9" class="hiddenRow">...starts there...
<table id="alertTable" class="dataTable table-striped table-bordered table-condensed" data-pagination-records="4" data-pagination-bottom="true"> <thead> <tr id="rowHead"> <th width="5%" class="sorting_disabled"><i id="cbxMaster" style="text-align:center;" class="icon-check-empty center pointerCursor" title="Click here to check/uncheck all the boxes below." onclick="changeIcon(this.id); checkAlerts('all');"></i></th> <th width="3%">SV</th> <th width="4%">Type</th> <th width="10%">Network</th> <th width="10%">Site</th> <th width="10%">Host</th> <th width="8%">Type</th> <th width="39%">Error: Short Description</th> <th width="17%">Date/Time</th> </tr> </thead> <tbody> {{#each alertRow}} <tr id="alertRow" data-idval="{{id}}" data-type="{{alertType}}" data-alert="{{alertLevel}}" data-toggle="collapse" data-target="#data{{id}}" class="accordion-toggle GradeA" style="background-color: {{setRowColor @index}}"> <td width="5%" id="alertLevel" onclick="cancelIt(event);" data-alert-id="{{id}}" data-alert-type="{{alertLevel}}" style="text-align:center; background-color:{{setCellColor alertLevel}}"><i id="dataCbx{{id}}" style="text-align:center;" class="icon-check-empty center pointerCursor" title="Click here to check/uncheck the box. This will indicate you want to CLEAR this alert from the list. Click on another part of the row to expand collapse without affecting the checkbox" onclick="changeIcon(this.id); checkAlerts(this.id);"></i></td> <td style="text-align: center;" id="svVal">{{getSVValue alertLevel}}</td> <td style="text-align: center;">{{abbrAType alertType}}</td> <td style="text-align: center;">{{#if network}}{{network}}{{else}}NA{{/if}}</td> <td style="text-align: center;">{{#if site}}{{site}}{{else}}NA{{/if}}</td> <td style="text-align: center;">{{#if resource}}{{resource}}{{else}}NA{{/if}}</td> <td style="text-align: center;">{{#if component}}{{component}}{{else}}NA{{/if}}</td> {{#if shortMessage}} <td width="30%" style="color: {{changeLvlColor alertLevel}}; font-weight: bolder;">{{shortMessage}}</td> {{else}} <td width="30%">No Message Available</td> {{/if}} <td width="20%">{{stripOutTimeDate alertTime}}</td> </tr> <tr style="background-color: white;"> <td id="alertDetails" colspan="9" class="hiddenRow"> <div id="data{{id}}" class="accordion-body collapse innerTableCollapse"> <div class="row"> <div class="span12" style="margin-left: 75px;"> <div style="float: left;"><h4>Server Name: {{getResNets @index "name" "nets" networkId}}</h4></div><br><br> <div style="float: left;"><h4>Status: <span style="color: {{changeLvlColor alertLevel}}; font-weight: bold;">{{alertLevel}}</span></h4></div> <div style="clear: both;"></div> <div style="float: left;"><strong>Issue Description:</strong><span style="color: {{changeLvlColor alertLevel}}; font-weight: bolder;"> {{shortMessage}}</span></div><br> <div style="float: left; width: 50%; word-wrap:break-word;"><strong>Alert Details:</strong> {{longMessage}}</div><br> <div style="float: left;"><strong>Status:</strong> {{status}}</div><br> <hr /> </div> <div class="span10" style="float: left; margin-left: 45px;"> <div class="span3" style="float: left; margin-left: 0px; width: 400px;"> <div class="span6"> <div style="float: left;"><strong>Resource Type:</strong> {{getResNets @index "name" "res" resourceId}}</div><br> <div style="float: left;"><strong>Host Name:</strong> {{getResNets @index "hostname" "res" resourceId}}</div><br> <div style="float: left;"><strong>Server IP:</strong> {{getResNets @index "hostip" "res" resourceId}}</div><br> <div style="float: left;"><strong>Hardware Type:</strong> {{getResNets @index "resourcetype" "res" resourceId}}</div><br> <div style="float: left;"><strong>Deployed:</strong> {{getResNets @index "datedeployed" "res" resourceId}}</div> </div> </div> <div class="span3" style="float: left; width: 400px; margin-right: 5px;"> <div class="span6"> <div style="float: left;"><strong><u>Network Interface</u></strong></div><br> <div style="float: left;"><strong>Ingress:</strong> {{getResNets @index "ingressip" "res" resourceId}}</div><br> <div style="float: left;"><strong>Egress:</strong> {{getResNets @index "egressip" "res" resourceId}}</div><br> <div style="float: left;"><strong>C&C:</strong> {{getResNets @index "candc" "res" resourceId}}</div><br> <div style="float: left;"><strong>IPMI:</strong> {{getResNets @index "ipmi" "res" resourceId}}</div> </div> </div> </div> <div style="clear: both;"> </div> <div class="span10" style="float: left;"> <div class="span3" style="float: left; margin-left: 12px !important; width: 200px;"> <p class="pull-left"><strong><a href="javascript:void(0);" onclick="displayDetCmts({{#if comments}}{{comments}}{{else}}'No comments at this time…'{{/if}})">Click for Comments</a></strong></p> </div> <p>ALERT ID: {{id}}</p> <!-- UNCOMMENT out at a later date <div class="span3" style="float: right; width: 400px; margin-right: 110px;"> <h4><strong>Notes</strong></h4> <p>04:52:32 - 08262013 - Entered by: Jason Admin<br><strong>Jane Jones is researching the situation</strong></p> </div> --> </div> </div> </div> </td> </tr> {{/each}} </tbody> </table>
That's my table. NOTICE I details row....<td id="alertDetails" colspan="9" class="hiddenRow">...starts there...