Частичное представление - >> Как обновить содержимое HTML без необходимости перенаправления на представление - PullRequest
2 голосов
/ 27 марта 2011

У моего сайта есть такая концепция, как Skype, которая позволяет пользователям переходить в «онлайн» и «оффлайн». Я создал частичное представление, которое позволяет пользователю переключать режим:

@if (Convert.ToBoolean(ViewData["IsLogged"].ToString()))
{
<div id="onlineStatus">
    You are currently <strong>ONLINE</strong> >>
    @Html.ActionLink("Go OFFLINE", "GoOffline", "Account")
</div>
}
else
{
<div id="offlineStatus">
    Ready for business >>
    @Html.ActionLink("Go ONLINE", "GoOnline", "Account")
</div>           
}

Вот как мы загружаем частичное представление:

public ActionResult OnlineStatusCtrl()
{
     if (SiteUser.IsAuthenticated)
        ViewData["IsLogged"] = SiteUser.IsOnline.ToString();

      return PartialView("OnlineStatusCtrl");
}

Когда пользователь нажимает на ссылку «Перейти в онлайн» или «Перейти в автономный режим», контроллер отвечает следующим образом:

public ActionResult GoOnline()
{
    if (SiteUser.IsAuthenticated)
        SiteUser.GoOnline();

    ViewData["IsLogged"] = "True";

    return RedirectToAction("Index", "Home");
    //return PartialView("OnlineStatusCtrl");
    //return EmptyResult();
}

public ActionResult GoOffline()
{
    if (SiteUser.IsAuthenticated)
        SiteUser.GoOffline(true);

    ViewData["IsLogged"] = "False";

    return RedirectToAction("Index", "Home");
}

Это хорошо работает ... но ЕДИНСТВЕННАЯ проблема в том, что, если я нахожусь в View XXXX и нажимаю "Перейти в Интернет", контроллер перенаправляет меня в индексное представление.

Я пытался "вернуть EmptyResult ()" или "вернуть PartialView (" OnlineStatusCtrl "), но он просто не работает.

Из кода видно, что PartialView заботится только о значении «ViewData ['IsLogged']»

ВОПРОС: Как обновить частичное представление без обновления всей страницы или перенаправления на главную страницу?

Может быть, дело в том, чтобы поместить Html.Beginform ()? Может быть, дело в том, что Контроллер возвращает что-то, что просто обновляет содержимое PartialView независимо от того, какое представление содержит сам PV?

Aiaiaiaia Я до сих пор не могу понять, как MVC работает с PartialViews /

Большое спасибо
... в продвинутом


UPDATE Я обновил код в соответствии с предложенным x, и вывод HTML выглядит следующим образом:

<div id="divStatus">
    <form action="/" data-ajax="true" data-ajax-mode="replace" data-ajax-update="#divStatus" id="form0" method="post">        
        <div id="offlineStatus">
            Ready for business >>
            <a href="/Account/GoOnline">Go Online</a>
        </div>
   </form>
</div>

Когда я нажимаю на ССЫЛКУ, контроллер return PartialView("_OnlineStatusCtrl");, который является именем вызывающего PV ... и ВСЯ СТРАНИЦА заменяется.

1 Ответ

1 голос
/ 27 марта 2011

Вам нужно будет использовать какой-нибудь ajax-вызов (помощники Microsoft ajax, встроенные в MVC, или ajax-вызов jquery / javascript.

Чтобы использовать Microsoft Ajax, вы можете использовать Ajax.BeginForm или Ajax.ActionLink. Оба принимают параметр AjaxOptions, который позволит вам установить функции javascript для OnSuccess, и UpdateTargetId для отображения возвращаемых данных (обычно это частичное представление). Использование этого вызовет ваше действие, которое должно вернуть частичное представление. Затем ваше частичное представление заменяет элемент html (обычно div), определенный параметром UpdateTargetId. Если вы решите пойти по этому пути, убедитесь, что вы ссылаетесь на все правильные сценарии Microsoft ajax / mvc. Вам в значительной степени понадобится каждый скрипт с любыми сочетаниями Microsoft, Ajax, Mvc и даже ненавязчивым в названии.

Вот пример одной из моих форм ajax (слегка измененных для простоты)

    <% using(Ajax.BeginForm("addAttribute", new { id = Model.PersonId, attributeId = item.AttributeId }, new AjaxOptions { UpdateTargetId = "myTargetId", OnSuccess = "initForm" })) { %>
        <input type="submit" value="Ok" class="editMode okButton" disabled="disabled" />
        <input type="button" class="editMode cancelButton" value="Cancel" />
        <br />
        <input type="button" value="Add" class="addButton" />
    <% } %>

У меня есть div с идентификатором «myTargetId» (для этого примера), который будет обновлен с возвращенным частичным представлением.

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