如何将子部分视图添加到父部分视图？

如何解决如何将子部分视图添加到父部分视图？

我有一个添加父子视图的按钮，父子视图也有一个在其中添加子子视图的添加按钮。我的问题是当我按主按钮添加2个父子视图并按添加子子按钮时在第二个父子视图中，然后在第一个父子视图中创建子子视图。我想根据父子视图添加子子视图。我该怎么办？

编码

//父部分

<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,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,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选择器，它将始终选择ID为Characteristics的第一个元素。

尝试以下代码：

function add(element){
        var action = ' @Url.Action("NewIndividualSearchCharacteristic","Blended")';
        $.post(action)
        .done(function (partialView) {
            element.previousElementSibling.append(partialView);
        });
}