обновите частичный просмотр после ненавязчивой публикации ajax на страницах Razor

#jquery #asp.net #asp.net-core #asp.net-core-mvc #razor-pages

Вопрос:

У меня есть Родительский вид, и я отрисовал в нем Частичный вид. И я добавил тег формы в частичное представление. Он отправляется на контроллер и возвращает данные, но содержимое частичного представления не обновляется.

 <div class="row main-section-border">
        <div class="col-sm-12">

            @{
                await Html.RenderPartialAsync("_Partial", Model);
            }
        </div>
        </div>
 

Частичный Вид

     @model RandomModel 
    <form asp-controller="Controller" asp-action="Save" method="POST" data-ajax="true" data-ajax-success="success" data-ajax-failure="failed" data-ajax-update="#spForm">

    <div class="row left-right-padding" id="spForm">
        <input type="text"  id="document" asp-for="Document">
</div>
 

Бэкэнд:

   public IActionResult Save(Random Model model)
        
     {     model.Document= "Random"
            return PartialView("~/Views/RandomFolder/_Partial.cshtml", model);
      }
 

Ответ №1:

возвращает PartialView(«~/Представления/Случайная папка/_Partial.cshtml», модель);

Так как вы используете unobtrusive ajax ,поэтому он вернет html-код частичного представления,но не обновит частичное представление.Если вы хотите обновить частичное представление,вы можете попробовать заменить html-код на data-ajax-complete .Вот рабочая демонстрация:

 div class="row main-section-border">
        <div id="div1" class="col-sm-12">

            @{
                await Html.RenderPartialAsync("_Partial", Model);
            }
        </div>
        </div>
@section scripts{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ajax-unobtrusive/3.2.6/jquery.unobtrusive-ajax.js"></script>
    <script>
        completed = function (xhr) {
            $("#div1").html(xhr.responseText);
        };
    </script>
}
 

Частичный вид:

 @model RandomModel 
    <form asp-controller="Controller" asp-action="Save" method="POST" data-ajax="true" data-ajax-success="success" data-ajax-failure="failed" data-ajax-update="#spForm" data-ajax-complete="completed">

    <div class="row left-right-padding" id="spForm">
        <input type="text"  id="document" asp-for="Document">
</div>
 

Серверная часть(вам нужно использовать ModelState.Clear(); , или она предпочтет использовать значение модели в ModelState, а не модель, которую вы передали в Частичное представление).:

 public IActionResult Save(RandomModel model)

        {
            ModelState.Clear();
            model.Document = "Random";
            return PartialView("~/Views/B/_Partial.cshtml", model);
        }
 

Результат:
введите описание изображения здесь

Комментарии:

1. Можете ли вы принять это как ответ? Спасибо.