在下拉列表中选择后附加多个 PartialViews

Posted

技术标签:

【中文标题】在下拉列表中选择后附加多个 PartialViews【英文标题】:Append Multiple PartialViews after Selection in Dropdownlist 【发布时间】:2021-08-22 14:41:02 【问题描述】:

我有一个视图,它为模型中的每个“单元”加载多个局部视图。如果用户更改了“评估”下拉列表中的选择,我需要使用正确的单位重新渲染部分。当页面加载时,它会加载以下内容:

                <div class="kt-portlet__body" id="unitSection" >
                    @if (Model.Units != null)
                    
                        foreach (var unit in Model.Units)
                        
                            html.RenderPartial("UnitGapRow", unit);
                        
                    
                </div>

当用户像这样更改下拉列表中的选择时,我正在进行 ajax 调用:

        $('#AssessmentId').change(function (e) 
           var assessmentId = $(this).val();
           getUnits(assessmentId);
        );

    function getUnits(assessmentId) 
    $('#unitSection').html('');
    $.ajax(
        url: "@(Url.Action("GetRequirementUnits", "Config", new  area = "Competency" ))",
        data: 
            AssessmentId: assessmentId,
            RequirementId: "@Model.RequirementId"
        ,
        type: "POST",
        success: function (data) 
            for (var unit in data) 
                $('#unitSection').append(@Html.RenderPartial("UnitGapRow",unit));
            
        
    )

除了每个单元的部分渲染之外,一切都有效。我尝试使用load 方法,但它“替换”而不是“附加”每个部分。

非常感谢任何帮助。

【问题讨论】:

【参考方案1】:

我能够通过循环“链接”“load()”方法来渲染部分。由于load()替换了,我动态创建了div,附加到原来的div上,用动态创建的div调用了load方法:

    function getUnits(assessmentId) 
    $('#unitSection').html('');
    $.ajax(
        url: "@(Url.Action("GetRequirementUnits", "Config", new  area = "Competency" ))",
        data: 
            AssessmentId: assessmentId,
            RequirementId: "@Model.RequirementId"
        ,
        type: "POST",
        success: function (data) 

            var i = 0;
            for (var x = 0; x < data.length; x++) 
                var unit = data[x];
                var unitId = unit.UnitId;
                $('#unitSection').append('<div id="div' + i + '"></div>');
                $('#div' + i).load('@Url.Action("GetRequirementUnit", "Config", new  area = "Competency" )?UnitId=' + unitId);
                i++;
            
        
    )

我希望这对其他人有帮助。

【讨论】:

以上是关于在下拉列表中选择后附加多个 PartialViews的主要内容,如果未能解决你的问题,请参考以下文章

附加选项后选择问题

选择多个复选框并附加其值

如何将选择标记选项值附加到Web服务角度4

选择下拉列表中的复选框后如何清除 v-autocomplete(多个)搜索输入?

仅当从下拉列表中选择选项时才附加到 iframe src

在选择下拉列表中选择多个选项