我需要在DataTables.js数据表中每当它处于非活动状态时突出显示一行。我在我的剃刀中设置了一些代码,用id
的“非活动”来标记<tr>
,并在我的CSS中设置了相应的背景颜色。但是,我不能得到任何东西,只是出现的原始风格。将动态样式应用于数据表行
CSS
/*
* Table styles
*/
table.pretty {
width: 100%;
clear: both;
}
table.pretty td#Inactive {
padding: 5px;
border: 1px solid #fff;
background-color: #FB9090;
}
table.pretty td,
table.pretty th {
padding: 5px;
border: 1px solid #fff;
}
/* Header cells */
table.pretty thead th {
background: #6699FF; /* #66a9bd; */
color: white;
}
/* Body cells */
table.pretty tbody th {
text-align: left;
background: black; /*#91c5d4; */
color: white;
}
table.pretty tbody td {
background: white; /* #d5eaf0; */
}
table.pretty tbody tr.odd td {
background: #e8eef4; /*#bcd9e1; */
}
/* Footer cells */
table.pretty tfoot th {
background: #b0cc7f;
text-align: left;
}
table.pretty tfoot td {
background: #d7e1c5;
text-align: center;
font-weight: bold;
}
tr#Inactive
{
background-color: #FB9090;
}
HTML(渲染)
<tr id=Inactive style="vertical-align:top;">
<td style="width:200px;">
Name
</td>
<td>
<a href="http://insideapps.dev.com/periscope/Pages/Dist.aspx?statProducer=03432402" class="noLine" target="_blank">Fixed</a>
</td>
<td style="width:50px;">
test
who's testing
I am
who's that eh?
me
</td>
<td style="width:50px;">
109161
</td>
<td style="text-align:center">
<a href=\\Prdhilfs03\l&i-sales class="noLine"><img src="/Content/Images/attachment.png" height="20px;" width="20px;"/></a>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td style="text-align:center; max-width: 50px;">
</td>
<td>
<a href="/BankListMaster/Edit/1"><img src="/Content/Images/Pencil-icon.png" alt="edit" height="20px;" width="20px;"/></a><br />
<a href="/BankListMaster/Details/1"><img src="/Content/Images/Actions-view-list-text-icon.png" alt="details" height="20px;" width="20px;"/></a><br />
<a href="/BankListMaster/Delete/1"><img src="/Content/Images/Actions-edit-delete-icon.png" alt="delete" height="20px;" width="20px;"/></a>
</td>
</tr>
jQuery的
$("#thetable").dataTable({
"sPaginationType": "full_numbers",
"iDisplayLength": 100,
"oLanguage": {
"sSearch": "Filter results:"
}
});
一次只有一个是不活动的? – jameslafferty