Размещать массив объектов из представления в контроллер, в asp. net core - PullRequest
0 голосов
/ 27 апреля 2020

Моя проблема заключается в следующем. У меня есть класс, давайте назовем его MyModel. Он содержит список Item,

public class MyModel
{
    public int Value { get; set; }
    public string Identity { get; set; }
    public List<Item> Items { get; set; }
}

public class Item
{
    public string Name { get; set; }
    public string Description { get; set; }
}

. Я хочу создать представление (форму) в .cs html и опубликовать результат в контроллере. Я знаю, как это сделать для модели. где у меня есть только строки или числа, но как мне это сделать, когда я хочу, чтобы пользователь ввел значение, идентичность, а затем список с элементом. Таким образом, пользователь должен ввести
Значение, Идентичность и (много раз) Элемент .

Есть предложения как это сделать? Я не видел ни одного примера с этим, поэтому я спрашиваю.

1 Ответ

0 голосов
/ 28 апреля 2020

Для отправки массива объектов из представления в контроллер вы можете обратиться к следующей демонстрации:

Просмотр

@model Demo3.Models.MyModels.MyModel

<div class="row">
 <div class="col-md-4">
    <form asp-action="CreateModel">
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
        <div class="form-group">
            <label asp-for="Value" class="control-label"></label>
            <input asp-for="Value" class="form-control" />
            <span asp-validation-for="Value" class="text-danger"></span>
        </div>
        <div class="form-group">
            <label asp-for="Identity" class="control-label"></label>
            <input asp-for="Identity" class="form-control" />
            <span asp-validation-for="Identity" class="text-danger"></span>
        </div>
        <div class="form-group">
            <table id="myRows" class="table">
                <tr class="myrow">
                    <td class="section table-column-center">
                        <label asp-for="Items[0].Name" class="control-label"></label>
                        <input asp-for="Items[0].Name" class="form-control" />
                        <span asp-validation-for="Items[0].Name" class="text-danger"></span>
                    </td>
                    <td class="section table-column-center">
                        <label asp-for="Items[0].Description" class="control-label"></label>
                        <input asp-for="Items[0].Description" class="form-control" />
                        <span asp-validation-for="Items[0].Description" class="text-danger"></span>
                    </td>
                </tr>

            </table>
        </div>
        <div class="item-add">
            <a id="add-row" class="link-button">Add Row</a>
        </div>
        <br/>
        <div class="form-group">
            <input type="submit" value="Create" class="btn btn-primary" />
        </div>
    </form>
 </div>
</div>

@section Scripts
{
<script>
$("#add-row").click(function () {
        var nextId = $(".myrow").length;

        var rowHtml = '<tr class="myrow">' +
            '<td class="section table-column-center" >' +
            '<input class="form-control" type="text" id="Items_' + nextId + '_Name" name="Items[' + nextId + '].Name" value=""/>' +

            '<span class="text-danger field-validation-valid" data-valmsg-for="Items[' + nextId + '].Name" data-valmsg-replace="true"></span>' +

            '</td>' +

            '<td class="section table-column-center">' +
            '<input class="form-control" type="text" id="Items_' + nextId + '_Description" name="Items[' + nextId + '].Description" value=""/>' +

            '<span class="text-danger field-validation-valid" data-valmsg-for="Items[' + nextId + '].Description" data-valmsg-replace="true"></span>' +

            '</td>'+

            '</tr>';

        $("#myRows").append(rowHtml);
    });
 </script>
 }

Контроллер

    public IActionResult PassDataList()
    {
        return View();
    }

    [HttpPost]
    public IActionResult  CreateModel(MyModel model)
    {
        return Json(model);
    }

Результат enter image description here

...