Можете ли вы просто обновить частичный вид вместо полного сообщения страницы?

Есть ли способ отправить частичную форму представления в asp.net mvc без перезагрузки родительской страницы, но перезагрузка частичного представления только в новое состояние? Подобно тому, как обновляются knockout.js, используя привязку данных.

Моя таблица данных отображает переменное количество столбцов/имен, поэтому я не думаю, что knockout.js является вариантом для этого, поэтому я пытаюсь использовать частичное представление.

Ответы

Ответ 1

Не без jQuery.

Что вам нужно сделать, это поставить Partial в div, что-то вроде:

<div id="partial">
    @Html.Partial("YourPartial")
</div>

Затем, чтобы обновить (например, нажав кнопку с идентификатором button), вы можете сделать:

$("#button").click(function () {
   $.ajax({
       url: "YourController/GetData",
       type: "get",
       data: $("form").serialize(), //if you need to post Model data, use this
       success: function (result) {
           $("#partial").html(result);
       }
   });
}

Тогда ваше действие будет выглядеть примерно так:

public ActionResult GetData(YourModel model) //that if you need the model
{
    //do whatever

    return View(model);
}

Ответ 2

Собственно, если ваш Partial имеет метод дочернего действия, вы можете отправить (или даже использовать привязку) непосредственно к дочернему действию и получить Ajax-подобный аффект. Мы делаем это в нескольких Представлениях.

Синтаксис

@Html.Action("MyPartial")

Действие Child

public ActionResult MyPartial()
{
    return PartialView(Model);
}

Если ваша форма отправляется дочернему действию

@using (Html.BeginForm("MyPartial"))
{
    ...
}

Частичный вид будет обновлен с частичным представлением, возвращаемым дочерним действием.

Jquery по-прежнему является законным способом обновления частичного. Но технически ответ на ваш вопрос: ДА.

Ответ 3

Я использовал бы помощник формы Ajax для таких сценариев, используя частичный вид и @html.RenderPartial( "partialName" ) частичные помощники

Ответ 4

Как обычно, что я нахожу при поиске таких вещей, люди дают слишком ограниченную информацию, поэтому я попытаюсь помочь здесь. Ключ должен установить div с идентификатором, к которому вы можете добавить возвращаемый html. Также, когда вы нажимаете ваш контроллер, убедитесь, что он возвращает частичный. Есть некоторые потенциальные проблемы с этим методом, но в хороший день он должен работать.

<div id="CategoryList" class="widget">
    @{
        Html.RenderPartial("WidgetCategories.cshtml");
    }
</div>

          function DeleteCategory(CategoryID) {
            $.get('/Dashboard/DeleteWidgetCategory?CategoryID=' + CategoryID,
                function (data) {
                    if (data == "No") {
                        alert('The Category has report widgets assigned to it and cannot be deleted.');
                    }
                    else {
                        $('#CategoryList').html(data);
                    }

                }
            );
        }


    [HttpGet("DeleteWidgetCategory")]
    [HttpPost("DeleteWidgetCategory")]
    public IActionResult DeleteWidgetCategory(string CategoryID)
    {
        string Deleted = CategoryModel.DeleteCategory(CategoryID);

        if (Deleted == "Yes")
        {
            return PartialView("WidgetCategories");
        }
        else
        {
            return this.Json("No");
        }
    }