发送MVC中的项目列表

时间:2016-11-29 06:41:28

标签: javascript c# jquery asp.net-mvc forms

这是我的项目

public class RequestViewModel
{    
    public long FeederId { set; get; }

    public int A { set; get; }

    public int B { set; get; }

    public int C { set; get; }

    public int Remain { set; get; }
}

这是我想要从我的表单发送到我的控制器的添加模型

public class RequestAddListViewModel
{
    public List<SuppliantRequestFeederAddViewModel> SuppliantRequestFeederAddViewModels { set; get; }

    public List<SelectListItem> FeederSelectListItems { set; get; }

    public long NodeId { set; get; }
}

第一次我的表单加载我有一个项目我有一个button当我点击它我的第一行克隆和append到我的表格例如现在我有8个项目在我的表格上,我可以删除客户端的每个项目。如果我没有删除任何项目并提交表格没有问题。 我的问题是当删除一个项目,例如第二个删除时,然后提交我的表单,我的控制器上没有项目。没有发送给Controller。

查看

@for (int index = 0; index < Model.RequestAddListViewModel.Count; index++)
{
    var req = Model.RequestAddListViewModel[index];
    <tr class="requestrow">
        <td>
            @Html.DropDownListFor(p => p.req[index].FeederId,     Model.FeederSelectListItems, new { @class = "form-control" })
        </td>
        <td>
            @Html.TextBoxFor(p => p.req[index].A, new { @class = "form-control" })
        </td>
        <td>
           @Html.TextBoxFor(p => p.req[index].B, new { @class = "form-control" })
        </td>
        <td>
            @Html.TextBoxFor(p => p.req[index].C, new { @class = "form-control" })
        </td>
        <td>
            <button type="button" class="btn btn-primary btn-icon btn-rounded newfeeder"><i class="icon-plus2"></i></button>
        </td>
    </tr>
}

和我的jQuery脚本(已编辑)

var inputCount=0;
$(document).on('click', '.newfeeder', function () {
    inputCount++;
    var tr = $(this).closest("tr").clone();
    tr.find("input").val(0);
    tr.find("button").removeClass("btn-primary").addClass("btn-danger").removeClass("newfeeder").addClass("deleterow");
    tr.find("button i").removeClass("icon-plus2").addClass("icon-trash");
    tr.find("input,select").each(function () {
        $(this).attr({
            'name': function (_, name) { return name.toString().replace('0', inputCount) },
            'id': function (_, id) { return id.toString().replace('0', inputCount) }
        });

    });
    $(this).closest("tr").after(tr);
});

$(document).on('click', '.deleterow', function() {
    $(this).closest("tr").remove();
});

1 个答案:

答案 0 :(得分:0)

最后,在我的表单中添加或删除新项目后,我找到了我的解决方案 我将此函数称为ReCreateIndex()

function ReCreateIndex(container) {
    $(container).each(function (index, obj) {
        $("input,select", $(this)).each(function () {
            if ($(this).attr("name")) {
                var name = $(this).attr("name").replace($(this).attr("name").replace(/[^0-9]/gi, ''), index);
                $(this).attr("name", name);
            }

            if ($(this).attr("id")) {
                var id = $(this).attr("id").replace($(this).attr("id").replace(/[^0-9]/gi, ''), index);
                $(this).attr("id", id);
            }
        });
    });
}

这意味着在对项目进行任何更改后,会重新创建项目的索引。