Refre sh Частичное представление с использованием Razor и Html Helper Ajax - PullRequest
0 голосов
/ 12 марта 2020

Я хочу обновить только часть моего представления при добавлении объекта в список. Я видел здесь ( Как сделать панель обновления в ASP. NET MVC), как использовать PartialView с Ajax HtmlHelper, но:

  1. Это дает мне только "новый" html, не все с обновленной частью. Как я могу сохранить тело html и обновить sh только тот блок, который мне нужен?
  2. Он не сохраняет модификации полей. Если я выбираю значение с помощью RadioButton и нажимаю «Далее», это значение не сохраняется в моей модели представления, и ModelState.IsValid в моем контроллере возвращает false. Как сохранить данные в моей модели представления?

Представление:

@using (Html.BeginForm("SubmitForm", "Form", FormMethod.Post, new { @class = "c-form" }))
{
    <div class="form_item">
        <div id="ItemListPanel">
            @{ Html.RenderPartial("_ItemList", Model.ItemList); }
        </div>
        @using (Ajax.BeginForm("SubmitForm",
                                "Form",
                                new AjaxOptions() { 
                                    UpdateTargetId = "ItemListPanel", 
                                    HttpMethod = "Post" 
                                })
        {
            <input id="AddItem" name="Form_AddItem"  type="submit" value="+ Add item" class="btn" />
        }
    </div>

    <script>
        document.getElementById('AddItem').addEventListener('click', () => {
            fetch('/ajaxpartial?handler=ItemList')
                .then((response) => {
                    return response.text();
                })
                .then((result) => {
                    document.getElementById('ItemListPanel').innerHTML = result;
                });
        });
    </script>

    <div>
        <input type="submit" name="Form_Previous" value="Previous" class="btn" />
        <input type="submit" name="Form_Next" value="Next" class="btn" />
    </div>
}

Частичное представление: (Упрощено, поскольку я использую шаблон с @ Html. DisplayFor () )

@model List<ItemList>
@for (int i = 0; i < Model.Count; i++)
{
    <div>
        @Html.LabelFor(m => Model[i].Value)
        <label>
            @Html.RadioButtonFor(m => Model[i].Value, Value_1)
            <span>Value 1</span>
        </label>
        <label>
            @Html.RadioButtonFor(m => Model[i].Value, Value_2)
            <span>Value 2</span>
        </label>
        @Html.ValidationMessageFor(m => Model[i].Value)
        @Html.HiddenFor(m => Model[i].Value)
    </div>
}

Контроллер:

[HttpParamAction]
[HttpPost]
public PartialViewResult Form_AddItem(FormViewModel viewModel)
{
    viewModel.ItemList.Add(new Item());
    return PartialView("_ItemList", viewModel.ItemList);
}

[HttpParamAction]
[HttpPost]
public ActionResult Form_Next(FormViewModel viewModel)
{
    if (!ModelState.IsValid)
        return View("Form", viewModel); // Error
    return View("Next", viewModel);
}

Примечание: только для информации, я использую [HttpParamAction] из Несколько кнопок отправки с ASP. NET MVC

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...