Вставка нескольких строк в ASP.NET MVC

Question

У меня проблемы с вставкой нескольких данных в мою базу данных. Это мой код ниже:

Класс контекста:

 public void Add(IEnumerable<UserInformation> model)
 {   
        foreach(UserInformation user in model)
        {
            _db.Add(user);
        }

        _db.SaveChanges();                                        
 }

Это мой контроллер:

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> Add(IEnumerable<UserInformation> userInformation)
{
        if (!ModelState.IsValid)
        {
        }   

       _ui_context.Add(userInformation);

        return new JsonResult("User Saved!");
}

Это мой взгляд:

 @model IEnumerable<MyMVC.Models.UserInformation>
 <form method="POST" id="form_data">                                               
                    <input type="hidden" id="action_value" value="" />
                    <table id="tbl_data" class="table table-bordered">
                        <thead>
                            <tr>
                                <th>First Name</th>
                                <th>Last Name</th>
                                <th>Location</th>
                            </tr>
                        </thead>
                        <tbody id="table_data">

                            <tr>
                                <td>
                                    <input  type="hidden" id="txtId" class="form-control" />
                                    <input name="firstname" class="form-control" id="txtFirst" />
                                    <span class="text-danger"></span>
                                </td>
                                <td>
                                    <input name="lastname" class="form-control" id="txtLast" />
                                    <span class="text-danger"></span>
                                </td>
                                <td>
                                    <input  name="location" class="form-control" id="txtLocation" />
                                    <span class="text-danger"></span>
                                </td>
                            </tr>


                        </tbody>                             
                    </table>                                   
                </form>              
                <a class="btn btn-info" id="btnAddField">Click to Add more Fields</a>

Это мой AJAX:

коды при добавлении полей

//Add fields
        var i = 1;
        $(document).on("click", "#btnAddField", function () {

            $("#table_data").append("<tr>"
                + "<td><input asp-for='FirstName' name='firstname' class='form-control' id='txtFirst" + i + "' />"
                + "<span class='text-danger'></span ></td>"
                + '<td><input asp-for="LastName" name="lastname" class="form-control" id="txtLast' + i + '" />'
                + '<span class="text-danger" ></span ></td>'
                + '<td><input asp-for="Location" name="location" class="form-control" id="txtLocation'+i+'" />'
                + '<span class="text-danger"></span ></td>'
                + "</tr > ");

            i++;
        });

коды в POST

var data = $('#form_data').serialize();                

                $.ajax({
                    method: "POST",
                    url: "/UserInformation/Add",
                    data: data,
                    dataType: "JSON",
                    success: function (data) {
                        alert(data);
                        clearFields();
                        $("#exampleModal").modal("hide");
                        loadUser();
                    }
                });        

Я получаю нулевой ответ на ajax каждый раз, когда отлаживаю его.Я очень благодарен, если вы поможете мне с этим.

Спасибо!

Answer 1

Чтобы привязка модели работала, вам нужно указать для полей индекс в свойстве name. Посмотрите на этот вопрос, где я ответил очень похожий вопрос:

Таким образом, ваш код должен выглядеть примерно так, как показано ниже, но обратите внимание, что использование asp-for в javascript, вероятно, не сработает, потому что для того, чтобы это работало, помощник по тегам должен отображаться на стороне сервера, где вы просто присоединяете html в дом.

Вам также необходимо сохранить промежуточную сумму для индекса, поскольку каждый i должен быть уникальным для этой группы UserInformation.

<tr>
    <td>
        <input  type="hidden" id="txtId" class="form-control" />
        <input name="UserInformation[0].firstname" class="form-control" id="txtFirst" />
        <span class="text-danger"></span>
    </td>
    <td>
        <input name="UserInformation[0].lastname" class="form-control" id="txtLast" />
        <span class="text-danger"></span>
    </td>
    <td>
        <input  name="UserInformation[0].location" class="form-control" id="txtLocation" />
        <span class="text-danger"></span>
    </td>
</tr>

//Add fields
var i = 1;
$(document).on("click", "#btnAddField", function () {

    $("#table_data").append("<tr>"
        + "<td><input asp-for='FirstName' name='UserInformation[i].firstname' class='form-control' id='txtFirst" + i + "' />"
        + "<span class='text-danger'></span ></td>"
        + '<td><input asp-for="LastName" name="UserInformation[i].lastname" class="form-control" id="txtLast' + i + '" />'
        + '<span class="text-danger" ></span ></td>'
        + '<td><input asp-for="Location" name="UserInformation[i].location" class="form-control" id="txtLocation'+i+'" />'
        + '<span class="text-danger"></span ></td>'
        + "</tr > ");

    i++;
});