如何在按钮点击上附加一些下拉列表,每个下拉列表在name属性中具有不同的索引?

时间:2017-12-21 07:11:11

标签: javascript jquery asp.net-mvc razor

我试图在按钮点击上附加一些下拉列表。这些下拉菜单中应该有一个正确的索引名称'属性。

这是下拉列表: -

Rdataframe= c('123456' , '234561' , '678912')
df_str = paste(Rdataframe , collapse = "','" , sep=" ")
queryStr = paste("Select * from table A where A.Id in ('" ,df_str , "')" , sep="")
print(queryStr)

这是我尝试的JS代码,用于克隆下拉列表并将其name属性替换为所需的索引。

<div id="dropdownDiv" style="display:none">
    <div class="form-group">
        @Html.LabelFor(model => model.PropertyInvestors, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownListFor(model => model.PropertyInvestors, (IEnumerable<SelectListItem>)@ViewBag.Investors, "Select Investor", htmlAttributes: new { @id = "dropdown",@name= "[#].PropertyInvestors", @class = "form-control",@onChange="dropdownChange()" })
            @Html.ValidationMessageFor(model => model.PropertyInvestors, "", new { @class = "text-danger" })
        </div>
    </div>
</div> 

问题: - 在点击它们时附加了下拉列表但是它们的名称属性对于所有下拉列表都是相同的,因为我不能将数据回发给控制器。

2 个答案:

答案 0 :(得分:1)

虽然这个问题可以通过使用虚拟代码和操纵索引号来解决。通过使用JS,一个好方法是通过为下拉列表创建局部视图并稍后进行ajax调用以将局部视图附加到主视图来使用Html.BeginCollectionItem()。请参阅答案HERE

答案 1 :(得分:0)

您可以按如下方式替换ID和名称:

$('#addDropdown').click(function () {
    var index = (new Date()).getTime();
    var clone1 = $('#dropdownDiv').clone();        
    $(clone1).find('select').attr("id", index);      
    $(clone1).find('select').attr("name", "PropertyInvestor[" + index +"]");  
    $('#field1').append(clone1.html());
});

JSFiddler:https://jsfiddle.net/qj24yybe/6/