在数据表中的行的子行中的行内,如何查找数据表中父行的访问权限。基本上,我想在点击扩展后的子行时突出显示父行。
我给所有的parentRows一个类名,当点击子行中的一个按钮时,我这样做了:
var tr = $(this).prev('.parentRow');
tr.addClass('rowIsDirty');
<tr class="vcenter parentRow">
<td class="hidden">@element.ElementName</td>
<td class="details-control meter"></td>
<td>@element.ElementTemplateName</td>
<td>@element.ElementName</td>
<td>@element.MeterTemplateName</td>
<td>@element.MeterName</td>
</tr>
<td class="details-control">@element.CaseDataPairs</td>
<td class="text-left"><b>@item.ProductName</b></td>
<td class="text-left">@item.ProductGroupName</td>
<td class="text-center">@item.VersionsCount</td>
<td class="text-center">
<a href="@Url.Action("ProductView", "ProductManagement", new RouteValueDictionary(new {productId = item.ProductId}))" class="btn btn-sm btn-secondary ui-tooltip details-Customer" id="ProductDetails"><i class="fa fa-pencil-square-o"></i></a>
</td>
<td class="text-center">
<input checked="@item.IsActive" data-toggle="toggle" class="toggleCheckBox ActivateProductButton" data-style="ios" data-on="Active" data-off="InActive" type="checkbox" id="EditAccountIsActive" data-product-id="@item.ProductId">
</td>
$(document).on('change', '.ActivateProductButton, function() {
UpdateStatus($(this));
});
function UpdateStatus(thisObj) {
var tr = thisObj.closest('.parentRow');
tr.removeClass('highlightExpanded');
tr.addClass('rowIsDirty');
}
它没有给我parentRow
突出显示。有什么想法吗?
答案 0 :(得分:1)
我尝试创建表格的简化版本,并在点击按钮时添加了一个事件......
希望您能够修改此代码以满足您的需求。
代码选择具有类.parentRow
的最近节点,并且由于嵌套行被添加为兄弟行,我们选择上一行(.prev()
)以标记为脏(或突出显示或其他)
如果您对代码有任何疑问,请与我们联系。
function UpdateStatus(thisObj) {
var tr = thisObj.closest('.parentRow').prev();
$(tr).removeClass('highlightExpanded');
$(tr).addClass('rowIsDirty');
}
$(document).ready(function() {
$('.UnitStatusButton').on('click', function() {
UpdateStatus($(this));
});
});
.highlightExpanded {
background-color: lightblue;
}
.rowIsDirty {
background-color: royalblue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr role="row" class="even shown">
<td class=" details-control">iconhere</td>
<td class="sorting_1">Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>$372,000</td>
</tr>
<tr class="parentRow highlightExpanded">
<td colspan="5">
<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">
<tbody>
<tr>
<td>Full name:</td>
<td>Brielle Williamson</td>
</tr>
<tr>
<td>Extension number:</td>
<td>4804</td>
</tr>
<tr>
<td>Extra info:</td>
<td>And any further details here (images etc)...</td>
</tr>
<tr>
<td>Edit</td>
<td>
<button class="UnitStatusButton">Click Me</button>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr role="row" class="even shown">
<td class=" details-control">iconhere2</td>
<td class="sorting_1">Jane Williamson</td>
<td>No Specialist</td>
<td>New York</td>
<td>$2,000</td>
</tr>
</table>