Send list of items in MVC

Question

this is my item

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; }
}

and this is my Add model that i want to send from my form to my Controller

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

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

    public long NodeId { set; get; }
}

first time my form load i have One item i have a button when i click on it my first row clone and append to my form for example now i have 8 item on my form, i can delete each item on client side. if i didn't delete any item and submit form there no problem. My problem is when delete one of item for example second one when deleted and then submit my form there is no item on my controller. nothing send to Controller.

View

@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>
}

and my jQuery script (Edited):

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();
});

You need to add a hidden input for the collection indexer. Refer [this answer](http://stackoverflow.com/questions/28019793/submit-same-partial-view-called-multiple-times-data-to-controller/28081308#28081308). Since you have a dropdownlist, then use the `BeginCollectionItem()` method. And you `var tr = $(this).closest("tr").clone();` line of code will never work correctly to be able to bind to you model when you submit — , Nov 29 '16 at 06:47
@SalarAfshar, your razor view markups and JS need to make sure the dropdown and textboxes have names in format `SuppliantRequestFeederAddViewModels[].` in which `index` is ascending ordered. — Bob Dust, Nov 29 '16 at 07:24
@StephenMuecke my problem is when i removed one of the item for example i have 8 items,when removed 3rd item and submit form just get 2 first item and all item after 3rd item not show on controller — Salar Afshar, Nov 29 '16 at 07:49
Read the link I gave you. You need to add a hidden input for the collection indexer. And as a side note, you view does not relate to the models you have shown — , Nov 29 '16 at 07:51
Wow, just a little bit of voting fraud happening on your account — , Nov 29 '16 at 08:31

score 0 · Accepted Answer · answered Dec 01 '16 at 06:46

finally i found my solution after add or delete new item to my form i call this function 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);
            }
        });
    });
}

it means that after any change on items,index of items recreated.

Send list of items in MVC

1 Answers1