Как я могу загрузить частичный вид внутри вид


Я очень путаю с этим частичным видом...

Я хочу загрузить частичный вид внутри моего основного вида ...

вот простой пример...

я загружаю индекс.cshtml действия индекса Homecontroller в качестве главной страницы..

в индекс.cshtml я создаю ссылку через

@Html.ActionLink("load partial view","Load","Home")

В HomeController я добавляю новое действие под названием

public PartialViewResult Load()
{
    return PartialView("_LoadView");
}

в _LoadView.cshmtl у меня просто есть

<div>
    Welcome !!
</div>

но, при запуске проекта, Индекс.cshtml сначала отображает и показывает мне ссылку "Загрузить частичный вид"... когда я нажимаю на это, он переходит на новую страницу instade рендеринга приветственного сообщения от _LoadView.cshtml в индекс.cshtml.

что может быть не так?

примечание: Я не хочу загружать страницу через AJAX или не хочу использовать Ajax.ActionLink

8 61

8 ответов:

если вы хотите загрузить частичный вид в главном окне вы можете использовать Html.Action помощник:

@Html.Action("Load", "Home")

или если вы не хотите проходить через действие загрузки, используйте HtmlPartial hepler:

@Html.Partial("_LoadView")

если вы хотите использовать Ajax.ActionLink, заменить Html.ActionLink С:

@Ajax.ActionLink(
    "load partial view", 
    "Load", 
    "Home", 
    new AjaxOptions { UpdateTargetId = "result" }
)

и, конечно, вам нужно включить держатель на Вашей странице, где будет отображаться частичное:

<div id="result"></div>

также не забудьте включают в себя:

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

в вашем главном представлении, чтобы включить Ajax.* помощников. И убедитесь, что ненавязчивый JavaScript включен в вашем веб -.конфиг (он должен быть по умолчанию):

<add key="UnobtrusiveJavaScriptEnabled" value="true" />

У меня была точно такая же проблема как Leniel. Я попробовал исправления, предложенные здесь и в десятке других мест. То, что, наконец, сработало для меня, просто добавляло

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")

к моему макету...

если вы делаете это с @Html.ActionLink() затем загрузка PartialView обрабатывается как обычный запрос при нажатии на элемент привязки, т. е. загрузка новой страницы с ответом метода PartialViewResult.
если вы хотите загрузить его immedialty, то вы используете @Html.RenderPartial("_LoadView") или @Html.RenderAction("Load").
если вы хотите сделать это на userinteraction (т. е. нажав на ссылку), то вам нужно использовать AJAX -->@Ajax.ActionLink()

для меня это сработало после того, как я загрузил Ajax ненавязчивую библиотеку через NuGet :

 Search and install via NuGet Packages:   Microsoft.jQuery.Unobtrusive.Ajax

чем добавить в представлении ссылки на jQuery и AJAX ненавязчиво:

@Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"> </script>

далее Ajax ActionLink и div мы хотим представить результаты:

@Ajax.ActionLink(
    "Click Here to Load the Partial View", 
    "ActionName", 
    null, 
    new AjaxOptions { UpdateTargetId = "toUpdate" }
)

<div id="toUpdate"></div>

маленький твик к выше

@Ajax.ActionLink(
    "Click Here to Load the Partial View", 
    "ActionName", 
    "ControlerName",
    null, 
    new AjaxOptions { UpdateTargetId = "toUpdate" }
)

<div id="toUpdate"></div>

RenderParital лучше использовать для производительности.

{@Html.RenderPartial("_LoadView");}

если вы хотите заполнить содержимое вашего частичного представления внутри вашего представления, вы можете использовать

@Html.Partial("PartialViewName")

или

{@Html.RenderPartial("PartialViewName");}

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

...
    @Html.Action("Load", "Home")
...

public PartialViewResult Load()
{
    return PartialView("_LoadView");
}

если вы хотите, чтобы пользователь нажал на ссылку, а затем заполнить данные частичного представления вы можете использовать:

@Ajax.ActionLink(
    "Click Here to Load the Partial View", 
    "ActionName", 
    "ControlerName",
    null, 
    new AjaxOptions { UpdateTargetId = "toUpdate" }
)

ОДНА ВЕЩЬ, ЧТОБЫ БЫТЬ В КУРСЕ - И Я УПАЛ ФОЛ ЭТОГО...

jquery.validate.unobtrusive.js
jquery.validate.unobtrusive.min.js

ЭТО НЕ ТО ЖЕ САМОЕ, ЧТО...

jquery.unobtrusive-ajax.js
jquery.unobtrusive-ajax.min.js

Я прочитал "ненавязчивый" и предположил, что у меня есть правильная библиотека - требуются AJAX!