Использование BeginCollectionItem с ядром MVC - PullRequest
0 голосов
/ 13 ноября 2018

У меня, похоже, нет тех же проблем, что и в большинстве случаев с реализацией BeginCollectionItem с ядром MVC, я не получаю никаких данных.

У меня есть главная страница, на которой много работы, но вот javascript, который добавляет новые разделы на страницу, и часть, которая будет добавлена ​​ниже.

@model QuizBuilderModel
...
function addSection() {
    $.ajax({
        url: '@Url.Action("AddSection","Quiz")',
        cache: false,
        success: function (html) {
        $("#sortable-survey").append(html);
        }
    });
}
...

<div class="quiz-builder" id="quiz-builder" style="@((Model.Quiz == null || string.IsNullOrEmpty(Model.Quiz.Id))? "display: none;" : "")">
        @{await Html.RenderPartialAsync("~/Views/Admin/Quiz/_QuizBuilder.cshtml", Model);}
</div>

Теперь у нас есть эта частичная часть, чтобы начать форму, которую мы строим.

@model QuizBuilderModel

<div id="sortable-survey" class="sortable-survey">
    @using (Html.BeginForm("PostQuizUpdate", "Quiz", FormMethod.Post))
    {
        @if (Model.Quiz != null && !string.IsNullOrEmpty(Model.Quiz.Id))
        {
            <input type="submit" class="btn btn-lg btn-outline-primary top-right-button top-right-button-single" id="SaveQuizModal" name="SaveQuizModal" value="Save Quiz" />
        }

        @if (Model.Quiz != null && Model.Quiz.Sections != null)
        {
            foreach (Sections section in Model.Quiz.Sections)
            {
                await Html.RenderPartialAsync("~/Views/Admin/Quiz/_Section.cshtml", Model);
            }
        }
    }
</div>

<div>
    <div class="text-center">
        <button type="button" class="btn btn-outline-primary btn-sm my-5" id="AddSection" onclick="addSection();">
            <i class="simple-icon-plus btn-group-icon"></i>
            Add Section
        </button>
    </div>
</div>

Тогда у меня есть этот частичный раздел, в который мы будем добавлять все больше и больше.

@using HtmlHelpers.BeginCollectionItemCore
@model Sections

@using (Html.BeginCollectionItem("Sections"))
{
    <div class="form-group">
        @Html.LabelFor(x => x.Title);
        @Html.EditorFor(m => m.Title, new { @class = "form-control" })
    </div>

    <div class="form-group">
        <label>SubTitle (optional)</label>
        @Html.EditorFor(m => m.SubTitle, new { @class = "form-control" })
    </div>

    <div class="form-group">
        <label>Instructions (optional)</label>
        <textarea type="text" class="form-control" placeholder="" id="Instructions" name="Instructions" required rows="10" cols="50"></textarea>
    </div>
}

Ответ на пост отправляется сюда ...

[HttpPost]
public async Task<IActionResult> PostQuizUpdate(IEnumerable<Sections> Sections)
{
    ...
}

Как я уже говорил, когда я нажимаю на кнопку отправки, я не получаю список разделов в сообщении.

1 Ответ

0 голосов
/ 14 ноября 2018

Ваш скрипт добавляет часть, содержащую BeginCollectionItem, к элементу <div id="sortable-survey" class="sortable-survey">. Но этот элемент содержит ваш элемент <form>....</form>, поэтому $("#sortable-survey").append(html); добавит html после закрывающего тега </form>, и в результате ваш <form> не будет содержать никаких элементов управления формой, поэтому отправлять нечего.

Измените HTML так, чтобы <div> находился в элементе <form>

@using (Html.BeginForm("PostQuizUpdate", "Quiz", FormMethod.Post))
{
    <div id="sortable-survey" class="sortable-survey">
        ....
    </div>
}

, чтобы элементы управления добавленной формы находились внутри тегов формы.

В качестве примечания: если ваше свойство Sections содержит какие-либо существующие элементы, то ваш await Html.RenderPartialAsync("~/Views/Admin/Quiz/_Section.cshtml", Model); выдаст Элемент модели, переданный в словарь, имеет тип .., но для этого словаря требуется элемент модели из введите исключение. Вам нужно изменить цикл foreach на

foreach (Sections section in Model.Quiz.Sections)
{
    await Html.RenderPartialAsync("~/Views/Admin/Quiz/_Section.cshtml", section); // section, not Model
}

Кроме того, я рекомендую вам инициализировать свои коллекции в контроллере перед передачей модели в представление, чтобы можно было удалить проверки if null в представлении.

...