Я хочу обновить только часть моего представления при добавлении объекта в список. Я видел здесь ( Как сделать панель обновления в ASP. NET MVC), как использовать PartialView с Ajax HtmlHelper, но:
- Это дает мне только "новый" html, не все с обновленной частью. Как я могу сохранить тело html и обновить sh только тот блок, который мне нужен?
- Он не сохраняет модификации полей. Если я выбираю значение с помощью 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