如何将子部分视图添加到父部分视图?
How to add child partial view to parent partial view?
我有一个添加父局部视图的按钮,父局部视图也有一个添加按钮,它在 it.My 中添加子局部视图问题是当我按下主按钮添加 2 个父局部视图并按下在第二个父分部视图中添加子分部按钮,然后在第一个父分部中创建子分部视图 view.I 想根据父分部视图添加子分部视图。我该怎么做?
编码
//父部分
<div id="individual-details" class="card">
<div class="card-header">
@(Model.SearchFirstName + Model.SearchLastName == "" ? "New Search Individual" : Model.SearchFirstName + Model.SearchLastName)
@if (ViewData["hideRemove"] == null || (bool?)ViewData["hideRemove"] == false)
{
<a id="individual-remove" href="#" onclick="removeIndividual(this)" class="btn btn-danger pull-right">Remove</a>
}
</div>
<div class="form-horizontal">
<div class="card-block">
<div class="form-group">
@Html.LabelFor(m => m.SearchPostcode, "Search Post Code", new { @class = "form-control-label" })
@Html.TextBoxFor(m => m.SearchPostcode, null, new { @class = "form-control" })
</div>
</div>
</div>
<div class="card-block">
<div id="Characteristics" class="mb-3">
@if (Model?.Characteristics != null)
{
for (var i = 0; i < Model?.Characteristics.Count; i++)
{
<div class="form-group">
@{ Html.RenderPartial("IndividualSearchCharacterisiticPartial", Model.Characteristics[i], new ViewDataDictionary()); }
@* @Html.EditorFor(m => m.Characteristics);*@
</div>
}
}
</div>
<button id="add-characteristics" onclick="add(this)" type="button" class="btn btn-success">Add Characteristics</button>
</div>
</div>
//Button
function add(element){
var action = ' @Url.Action("NewIndividualSearchCharacteristic", "Blended")';
$.post(action)
.done(function (partialView) {
$('#Characteristics').append(partialView);
});
}
//子部分
@model ABC.Core.Models.DTOs.Characteristic
@using (Html.BeginCollectionItem("Characteristics"))
{
<div id="characteristic-details" class="card">
<div class="form-horizontal">
<div class="card-block">
<div class="container">
<div class="row">
<div class="col-*-*">
@Html.LabelFor(m => m.Name, "Name", new { @class = "form-control-label" })
</div>
<div class="col">
@Html.TextBoxFor(m => m.Name, null, new { @class = "form-control" })
</div>
<div class="col-*-*">
@Html.LabelFor(m => m.Value, "Value", new { @class = "form-control-label" })
</div>
<div class="col">
@Html.TextBoxFor(m => m.Value, null, new { @class = "form-control" })
</div>
<div class="col-*-*">
<a id="characteristic-remove" href="#" onclick="removeCharacteristic(this)" class="btn btn-danger pull-right">Remove</a>
</div>
</div>
</div>
</div>
</div>
</div>
}````
$('#Characteristics').append(partialView);
如果您使用 ID select或者,它将始终 select 第一个 ID 为 Characteristics
的元素。
试试下面的代码:
function add(element){
var action = ' @Url.Action("NewIndividualSearchCharacteristic", "Blended")';
$.post(action)
.done(function (partialView) {
element.previousElementSibling.append(partialView);
});
}
我有一个添加父局部视图的按钮,父局部视图也有一个添加按钮,它在 it.My 中添加子局部视图问题是当我按下主按钮添加 2 个父局部视图并按下在第二个父分部视图中添加子分部按钮,然后在第一个父分部中创建子分部视图 view.I 想根据父分部视图添加子分部视图。我该怎么做?
编码
//父部分
<div id="individual-details" class="card">
<div class="card-header">
@(Model.SearchFirstName + Model.SearchLastName == "" ? "New Search Individual" : Model.SearchFirstName + Model.SearchLastName)
@if (ViewData["hideRemove"] == null || (bool?)ViewData["hideRemove"] == false)
{
<a id="individual-remove" href="#" onclick="removeIndividual(this)" class="btn btn-danger pull-right">Remove</a>
}
</div>
<div class="form-horizontal">
<div class="card-block">
<div class="form-group">
@Html.LabelFor(m => m.SearchPostcode, "Search Post Code", new { @class = "form-control-label" })
@Html.TextBoxFor(m => m.SearchPostcode, null, new { @class = "form-control" })
</div>
</div>
</div>
<div class="card-block">
<div id="Characteristics" class="mb-3">
@if (Model?.Characteristics != null)
{
for (var i = 0; i < Model?.Characteristics.Count; i++)
{
<div class="form-group">
@{ Html.RenderPartial("IndividualSearchCharacterisiticPartial", Model.Characteristics[i], new ViewDataDictionary()); }
@* @Html.EditorFor(m => m.Characteristics);*@
</div>
}
}
</div>
<button id="add-characteristics" onclick="add(this)" type="button" class="btn btn-success">Add Characteristics</button>
</div>
</div>
//Button
function add(element){
var action = ' @Url.Action("NewIndividualSearchCharacteristic", "Blended")';
$.post(action)
.done(function (partialView) {
$('#Characteristics').append(partialView);
});
}
//子部分
@model ABC.Core.Models.DTOs.Characteristic
@using (Html.BeginCollectionItem("Characteristics"))
{
<div id="characteristic-details" class="card">
<div class="form-horizontal">
<div class="card-block">
<div class="container">
<div class="row">
<div class="col-*-*">
@Html.LabelFor(m => m.Name, "Name", new { @class = "form-control-label" })
</div>
<div class="col">
@Html.TextBoxFor(m => m.Name, null, new { @class = "form-control" })
</div>
<div class="col-*-*">
@Html.LabelFor(m => m.Value, "Value", new { @class = "form-control-label" })
</div>
<div class="col">
@Html.TextBoxFor(m => m.Value, null, new { @class = "form-control" })
</div>
<div class="col-*-*">
<a id="characteristic-remove" href="#" onclick="removeCharacteristic(this)" class="btn btn-danger pull-right">Remove</a>
</div>
</div>
</div>
</div>
</div>
</div>
}````
$('#Characteristics').append(partialView);
如果您使用 ID select或者,它将始终 select 第一个 ID 为 Characteristics
的元素。
试试下面的代码:
function add(element){
var action = ' @Url.Action("NewIndividualSearchCharacteristic", "Blended")';
$.post(action)
.done(function (partialView) {
element.previousElementSibling.append(partialView);
});
}