Question

我正在尝试在MVC Asp.Net中添加和删除表单字段。我已经按照this tutorial动态添加和删除表单字段。

我只遇到了这部分代码的问题。在下面的代码中，它只添加了一个文本框。

if(x < max_fields){ //max input box allowed
        x++; //text box increment
        $(wrapper).append('<div><input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
    }
});

但是我想通过使用MVC助手而不是html代码添加2个下拉列表和1个文本框。

我有2个下拉列表，大小和颜色以及1个数据文本框。下拉列表正在填充DB中的值。

<div class="form-group">
    <div class="row">
        <div class="input_fields_wrap">
            <button class="add_field_button">Add More Fields</button>
            <div class="col-md-2">
                @Html.DropDownList("ProductSizeVariantId", null, "Size", new { @class = "control-label" })
            </div>
            <div class="col-md-2">
                @Html.DropDownList("ProductSizeVariantValueId", null, "Select Size", new { @class = "control-label" })
            </div>
            <div class="col-md-2">
                @Html.DropDownList("ProductColorVariantId", null, "Select Color", new { @class = "control-label" })
            </div>
            <div class="col-md-2">
                @Html.TextBoxFor(x => x.Stock, new { @placeholder = "Quantity", @class = "form-control" })
            </div>
         </div>
    </div>
</div>

这是我尝试过的

$(wrapper).append('<div><div class="col-md-2">@Html.DropDownList("ProductSizeVariantId", null, "Size", new { @class = "control-label" })</div><div class="col-md-2">@Html.DropDownList("ProductSizeVariantValueId", null, "Select Size", new { @class = "control-label" })</div><div class="col-md-2">@Html.DropDownList("ProductColorVariantId", null, "Select Color", new { @class = "control-label" })</div><div class="col-md-2">@Html.TextBoxFor(x => x.Stock, new { @placeholder = "Quantity", @class = "form-control" })</div><a href="#" class="remove_field">Remove</a></div>'); //add input box

添加上面的代码后，当我单击AddMore按钮时，它会重新加载页面。

在MVC Asp.Net中添加动态表单字段

0 个答案: