C# 在局部视图中绑定Dropdownlist

我需要创建一个视图，在该视图中可以添加其他表单供用户输入。该表单有几个下拉列表。当用户单击“添加新”按钮时，我试图添加另一个表单，但我不知道如何添加以及如何在部分视图中绑定DropDownList

以下是主视图中的代码：

  @using (Html.BeginForm())
    {
        <form class="autoWidth">
            <h4 class="hr">
                <a class="btn btn-danger icon-subtract sm btn-xs" data-nodrag ng-click="remove(this)"></a>
            </h4>
            <div class="">
                <span class="inline-block">
                    @Html.LabelFor(model => model.LoanClasses, new { @class = "control-label" })
                    @Html.DropDownListFor(model => model.SelectedLoanClass, Model.LoanClasses, new { @class = "inputROW" })
                </span>   
                <span class="inline-block">
                    @Html.LabelFor(model => model.LoanPurpose, new { @class="control-label"})
                    @Html.DropDownListFor(model => model.SelectedLoanPurpose, Model.LoanPurpose, new { @class = "inputROW" })

                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.AmountRequested, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.AmountRequested, new{@class="inputROW"})
                </span>  
                <span class="inline-block">
                    @Html.LabelFor(model => model.RequestedRate, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.RequestedRate, new { @class = "inputROW" })
                </span> 
            </div>
            <div class="breakup">
                <span class="inline-block">
                    @Html.LabelFor(model => model.LoanTypes, new { @class = "control-label" })
                    @Html.DropDownListFor(model => model.SelectedLoanType, Model.LoanTypes, new { @class = "inputROW" })
                    <span id="types-loading-progress" style="display: none;">Please wait...</span>
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.RateIndex, new { @class = "control-label" })
                    @Html.DropDownListFor(model => model.SelectedRateIndex, Model.RateIndex, new { @class = "inputROW" })
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.OriginationFeePercentage, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.OriginationFeePercentage, new { @class = "inputROW" })
                </span>
            </div>
            <div class="breakup">
                <span class="inline-block">
                    @Html.LabelFor(model => model.VariableRateFloor, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.VariableRateFloor, new { @class = "inputROW" })
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.VariableRateCeiling, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.VariableRateCeiling, new { @class = "inputROW" })
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.VariableRateMargin, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.VariableRateMargin, new { @class = "inputROW" })
                    </span>
             </div>
            <div class="breakup">
                <span class="inline-block">
                    @Html.LabelFor(model => model.PaymentType, new { @class = "control-label" })
                    @Html.DropDownListFor(model => model.SelectedPaymentType, Model.PaymentType)
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.PaymentPeriod, new { @class = "control-label" })
                    @Html.DropDownListFor(model => model.SelectedPaymentPeriod, Model.PaymentPeriod)
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.NumberOfPayments, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.NumberOfPayments, new { @class = "inputROW" })
                </span>
                <span class="inline-block">
                    @Html.LabelFor(model => model.AmortizationTerm, new { @class = "control-label" })
                    @Html.TextBoxFor(model => model.AmortizationTerm, new { @class = "inputROW" })
                </span>
            </div>

        </form>
    }
    <div id="newrow">
    <div><input id="addBtn" type="button" value="Add New" /></div>
</div>

<script>
    $("#addBtn").on("click", function () {

        $.get('@Url.Action("AddNewRow")', function () {
            $('#newrow');
        });

    });
</script>
<script type="text/javascript">
    $(function () {
        $("#SelectedLoanClass").change(function () {
                 var selectedItem = $(this).val();
                 var ddlTypes = $("#SelectedLoanType");
              var typesProgress = $("#types-loading-progress");
             typesProgress.show();
             $.ajax({
                 cache: false,
                 type: "GET",
                 url: "@(Url.RouteUrl("GetLoanTypesByClass"))",
                    data: { "LoanClassId": selectedItem },
                    success: function (data) {
                        ddlTypes.html('');
                        $.each(data, function (id, option) {
                            ddlTypes.append($('<option></option>').val(option.id).html(option.name));
                        });
                        typesProgress.hide();
                    },
                    error: function (xhr, ajaxOptions, thrownError) {
                        alert('Failed to retrieve types.');
                        typesProgress.hide();
                    }
                });
            });
        });
</script> 

任何帮助都将不胜感激

我意识到我没有很好地解释这一点，所以结果应该是这样的：

Loan Request 1

Loan Class     Loan Purpose    Requested Amount, etc. etc.

Loan Type       Rate Index     Origination Fee, etc. etc.


Loan Request 2

Loan Class     Loan Purpose    Requested Amount, etc. etc.

Loan Type      Rate Index      Origination Fee, etc. etc. 

Loan Request 3

Loan Class      Loan Purpose      Requested Amount, etc. etc.

Loan Type       Rate Index        Origination Fee, etc. etc.

---

我试图使用局部视图来不断呈现新的空白贷款请求。他们希望他们中的每一个人都能像上面那样显示在一个列表中。如果有更好的方法来达到预期的效果，欢迎任何指导

要添加新行，请尝试

$.get（'@Url.Action（“AddNewRow”）'）、函数（data）{$（'#newrow'）.html（data）；}）

但不清楚您试图对所显示的代码执行什么操作。而且您没有在

AddNewRow（）

方法中将模型传递给视图当我试图将模型传递给AddNewRow（）中的视图时，dropdownlist上的一个错误告诉我他们没有数据。从技术上讲，我试图添加的“行”实际上不是一行，它是一个具有全新形式的局部视图，与主视图中以@Html.BeginForm开头的部分视图完全相同。#newrow div是我希望局部视图显示的地方。我猜真正需要做的是，AddNewRow按钮需要在主视图中保存第一条记录，然后呈现局部视图（这只是与主视图相同的另一个空表单）。我是否需要在填充主视图上DropDownList的控制器中包含所有相同的代码？我不确定我的解释是否正确，但你肯定知道自己在做什么，所以我希望你能帮助我。不清楚你到底想做什么（抱歉，但这毫无意义，在任何情况下，单击

AddNewRow

都不会保存第一条记录），但是您需要将一个模型传递给您的partial，其中包括

SelectList

s，否则

@Html.DropDownListFor（model=>model.SelectedLoanPurpose，…

将引发异常，因为

model.SelectedLoanPurpose

为空。如果部分与主视图中的代码相同，那么为什么不将所有代码替换为

@Html.partial（“\u yourposal”，model）

，以避免重复。

   [HttpGet]
        [Route("Create")]
        public ActionResult AddNewRow()
        {

            return PartialView("_newLoanRequest");
        }

Loan Request 1

Loan Class     Loan Purpose    Requested Amount, etc. etc.

Loan Type       Rate Index     Origination Fee, etc. etc.


Loan Request 2

Loan Class     Loan Purpose    Requested Amount, etc. etc.

Loan Type      Rate Index      Origination Fee, etc. etc. 

Loan Request 3

Loan Class      Loan Purpose      Requested Amount, etc. etc.

Loan Type       Rate Index        Origination Fee, etc. etc.