从子表更新父表单元格值
Posted
技术标签:
【中文标题】从子表更新父表单元格值【英文标题】：Update parent table cell value from child table 【发布时间】：2021-05-03 02:09:05 【问题描述】：我有一张表（父表）和该表中的另一个表（子表）。
我想从子表中更新父表的单元格值。
<table id="example" class="table table-bordered table-striped mt-4 nowrap" style="width:100%">
<thead>
<tr class="bg-primary text-light">
<th></th>
<th>
@html.DisplayName("Restaurant Name")
</th>
<th>
@Html.DisplayName("Delivery Date")
</th>
<th>
@Html.DisplayName("Status")
</th>
<th class="none">
@Html.DisplayName("Preferred Delivery Date")
</th>
<th class="none">
<b> @Html.DisplayName("Item List") </b>
</th>
<th class="none"></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
<tr>
<td></td>
<td>
@Html.DisplayFor(modelItem => item.RestaurantName)
</td>
<td>
@String.Format("0:dd/MM/yyyy", item.DELIVERED_DATE)
@*@Html.DisplayFor(modelItem => item.DELIVERED_DATE.Value.ToString("dd/MM/yyyy"))*@
</td>
<td>
@if (item.STATUS == 1)
<span class="badge badge-secondary">Draft</span>
@if (item.STATUS == 2)
<span class="badge badge-warning">Pending confirmation</span>
@if (item.STATUS == 3)
<span class="badge badge-primary">Confirmed</span>
@if (item.STATUS == 4)
<span class="badge badge-suceess">Delivered</span>
</td>
<td>
: @String.Format("0:dd/MM/yyyy", item.PREFERRED_DELIVERY_DATE)
</td>
<td>
:
<table>
<thead>
<tr class="bg-primary text-light">
<th>
@Html.DisplayName("Item Name")
</th>
<th>
@Html.DisplayName("Quantity")
</th>
<th>
@Html.DisplayName("Price")
</th>
</tr>
</thead>
<tbody>
<tr>
@foreach (var test in item.OrderSupplierItems)
<tr>
<td>@Html.DisplayFor(modelItem => test.IngredientName)</td>
<td>@Html.DisplayFor(modelItem => test.QUANTITY)</td>
<td>@Html.DisplayFor(modelItem => test.PRICE)$</td>
</tr>
<tr>
<td colspan="2">Sum</td>
<td>@item.OrderSupplierItems.Sum(b => b.PRICE)$</td>
</tr>
<tr>
</tbody>
</table>
</td>
<td>
<a class='Confirm btn btn-success' href='javascript:;@item.ID_ORDER_SUPPLIER'>CONFIRM</a>
<a class='btn btn-primary'>MAKE CHANGES</a>
</td>
</tr>
</tbody>
</table>我想更改 ajax 成功请求的状态。
$("body").on("click", "#example TBODY .Confirm", function ()
if (confirm("Do you want to confirm this order?"))
var row = $(this).closest("tr");
var orderSupplierId = $(this).attr('href').substr(12);
$.ajax(
type: "PUT",
url: "@System.Configuration.ConfigurationManager.AppSettings["ServiceUrl"]/api/OrderSupplier/" + orderSupplierId +"?status=3",
contentType: 'application/json', // <---add this
dataType: 'text',
success: function (response)
//here i want to do this
,
error: function (xhr, textStatus, errorThrown)
console.log(errorThrown);
);
我需要根据确认更改按钮更新父表的状态字段。 我需要替换当前表的状态字段的当前文本。
【问题讨论】：
确认状态来自后端？response 到底有什么？
你不用担心响应，我只想更新行文本
【参考方案1】：
您可以使用closest('tr').find("td:eq(3)")，这将引用表格中的第四列td，即：状态列并使用.html 或.text 在那里进行更改。
演示代码：
$("body").on("click", ".Confirm", function()
if (confirm("Do you want to confirm this order?"))
var row = $(this); //declare this outside..ajax call
var orderSupplierId = $(this).attr('href').substr(12);
//ajaxcodes..
//success: function(response)
//here i want to do this
row.closest('tr').find("td:eq(3)").html('<span class="badge badge-primary">Confirmed</span>')
//,
//other codes
)<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<table id="example" class="table table-bordered table-striped mt-4 nowrap" style="width:100%">
<thead>
<tr class="bg-primary text-light">
<th></th>
<th>
Restaurant Name
</th>
<th>
Delivery Date
</th>
<th>
Status
</th>
<th class="none">
Preferred Delivery Date
</th>
<th class="none">
<b>Item List </b>
</th>
<th class="none"></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td>
Somehtings..
</td>
<td>
02/02/202
</td>
<td>
<span class="badge badge-warning">Pending confirmation</span>
</td>
<td>
02/3/2020
</td>
<td>
<table>
<thead>
<tr class="bg-primary text-light">
<th>
Item Name
</th>
<th>
Quantity
</th>
<th>
Price
</th>
</tr>
</thead>
<tbody>
<tr>
<tr>
<td>somehting</td>
<td>abc</td>
<td>12$</td>
</tr>
<tr>
<td colspan="2">Sum</td>
<td>123$</td>
</tr>
<tr>
</tbody>
</table>
</td>
<td>
<a class='Confirm btn btn-success' href='javascript:;@item.ID_ORDER_SUPPLIER'>CONFIRM</a>
<a class='btn btn-primary'>MAKE CHANGES</a>
</td>
</tr>
<tr>
<td></td>
<td>
Somehtings..
</td>
<td>
02/02/202
</td>
<td>
<span class="badge badge-success">Delivered</span>
</td>
<td>
02/3/2020
</td>
<td>
<table>
<thead>
<tr class="bg-primary text-light">
<th>
Item Name
</th>
<th>
Quantity
</th>
<th>
Price
</th>
</tr>
</thead>
<tbody>
<tr>
<tr>
<td>somehting</td>
<td>abc</td>
<td>12$</td>
</tr>
<tr>
<td colspan="2">Sum</td>
<td>123$</td>
</tr>
<tr>
</tbody>
</table>
</td>
<td>
<a class='Confirm btn btn-success' href='javascript:;@item.ID_ORDER_SUPPLIER'>CONFIRM</a>
<a class='btn btn-primary'>MAKE CHANGES</a>
</td>
</tr>
</tbody>
</table>【讨论】：
对我来说，它更新了 12 美元的价值。 我正在使用数据表 var table = $('#example').DataTable( responsive: details: type: 'column' , columnDefs: [ className: 'control' , orderable: false, 目标: 0 ], order: [1, 'asc'] ); row.closest('tr').closest('table').find("td:eq(3)") ，这行得通，感谢您的帮助，我接受了答案 【参考方案2】：您可以使用 .closest() 从您所在的元素（即按钮）向后搜索。然后从那里找到状态字段。最好是给状态一个类或ID。所以：
$(this).closest('table').find('.status')
【讨论】：
有什么问题？我是用 $ 来表明它是一个 jquery 对象吗？ 最接近的，我试过了，但还是不行，谢谢 我修正了错字。对不起。但是你必须展示更多你实际在做什么的代码。 我确实删除了 $，以避免讨论......不过，我觉得这是一个好习惯。 @AyushShukla 你说它不工作，但然后告诉我你写了什么。最接近的绝对是遍历父母的方式，所以...以上是关于从子表更新父表单元格值的主要内容，如果未能解决你的问题，请参考以下文章
创建指向另一个 Excel 工作表单元格的链接，并查找最后一个单元格值
使用默认单元格值加载一次视图后如何更新 UITableView 单元格（cell.detailTextLabel.text）的值