【发布时间】:2021-11-22 09:15:33
【问题描述】:
我已经在我的项目中使用嵌套表视图到第二级它运行良好,但问题是当我添加第三级子子时。当我单击 2 级子子按钮以展开 3 级子子视图时,它只是折叠表格。基本上,这个想法是每个客户都有一些销售 ID,它显示在第二级子子嵌套表中,并且在每个销售 ID 下,有一些我想在第三级子子嵌套表中显示的项目。请帮我解决这个问题。我在这里做错了什么? In the picture you can see the nested table view up to 2nd level sub child
<script type="text/javascript">
$(document).ready(function () {
$('.parentTable.table .accordian-body').on('show.bs.collapse', function () {
$(this).closest("table")
.find(".collapse.in")
.not(this)
.collapse('toggle')
})
$('.subTable.table .accordian-body').on('show.bs.collapse', function () {
$(this).closest("table")
.find(".collapse.in")
.not(this)
.collapse('toggle')
})
$('.bb').on('click', function (e) {
$('.bb').toggleClass("bb glyphicon glyphicon-minus"); //you can list several class names
e.preventDefault();
});
$('.subbutton').on('click', function (e) {
$('.subbutton').toggleClass("bb glyphicon glyphicon-minus"); //you can list several class names
e.preventDefault();
});
});
</script>
<style>
.hiddenRow {
padding: 0 !important;
}
</style>
@model IEnumerable<DEtelecom.ViewModel.VmCustomerModel>
@{
ViewBag.Title = "Customer Sales Information";
WebGrid grid = new WebGrid(source: Model, canSort: false);
}
<div class="panel-body table-responsive">
<table class="customTable table table-hover parentTable">
<thead class="thead-light">
<tr class="d-flex">
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></th>
<th scope="col" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
Customer Name
</th>
<th scope="col" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
Total Amount
</th>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr class="accordion-toggle d-flex" data-toggle="collapse" data-target="#AA_@(item.ID)">
<td class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<button class="bb glyphicon glyphicon-chevron-down" id="togglerow" type="button">
</button>
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(item.CustomerName)
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(string.Format("{0:C}", item.TotalAmount))
</td>
</tr>
<tr>
<td class="hiddenRow t" colspan=3>
<div class="accordian-body collapse table-responsive" id="AA_@(item.ID)">
<table class="table table-hover subTable">
<thead class="thead-light">
<tr class="d-flex">
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></th>
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
Sales Number
</th>
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
Bstnr
</th>
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
Creation Date
</th>
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
Due Dtae
</th>
<tbody>
@foreach (var sales in item.SalesList)
{
<tr class="accordion-toggle d-flex" data-toggle="collapse" data-target="#AA_@(item.ID)">
<td class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<button class="subbutton glyphicon glyphicon-chevron-down" id="subtogglerow" type="button"></button>
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(sales.SalesID)
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(sales.Bstnr)
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(string.Format("{0:d}", sales.CreationDate))
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(string.Format("{0:d}", sales.DueDate))
</td>
</tr>
<tr>
<td class="hiddenRow t" colspan=5>
<div class="accordian-body collapse table-responsive" id="AA_@(item.ID)">
<table class="table table-hover subTable">
<thead class="thead-light">
<tr class="d-flex">
<th scope="col" class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
Item Description
</th>
<th scope="col" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
Quantity
</th>
<th scope="col" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
Unit Price
</th>
<th scope="col" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
Amount
</th>
<tbody>
@foreach (var items in sales.ItemList)
{
<tr class="d-flex">
<td scope="row" class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
@Html.Raw(items.Description)
</td>
<td scope="row" class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
@Html.Raw(items.Quantity)
</td>
<td scope="row" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
@Html.Raw(string.Format("{0:C}", items.UnitPrice))
</td>
<td scope="row" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
@Html.Raw(string.Format("{0:C}", items.Amount))
</td>
</tr>
}
</tbody>
</table>
</div>
</td>
</tr>
}
</tbody>
</table>
</div>
</td>
</tr>
}
</tbody>
</table>
</div>
【问题讨论】:
标签: javascript c# asp.net model-view-controller