【问题标题】:How can I get alerts to only show on a specific tab of a tabbed layout using MVC?如何使用 MVC 获取仅显示在选项卡式布局的特定选项卡上的警报?
【发布时间】:2014-02-03 23:21:56
【问题描述】:

我有一个带有选项卡布局的视图,以及每个选项卡的表单(使用部分)。我想在每个选项卡的基础上向用户提供反馈,但我的代码也可以重复使用。

所以,父页面:

<div id="detailsLayout">
@using (var tabs = Html.Bootstrap().Begin(new Tabs("TabsId")))
{
    @tabs.Tab(Html.LabelFor(m => m.course).ToString())
    @tabs.Tab(Html.LabelFor(m => m.baselineData).ToString())
    @tabs.Tab(Html.LabelFor(m => m.assessments).ToString())
    @tabs.Tab(Html.LabelFor(m => m.groups).ToString())


    using (tabs.BeginPanel())
    {
        <h2>@Html.LabelFor(m => m.course)</h2>
        Html.RenderAction("Edit", "Course");
    }
    using (tabs.BeginPanel())
    {
        <h2>@Html.LabelFor(m => m.baselineData)</h2>
        Html.RenderAction("Edit", "BaselineData");
    }
    using (tabs.BeginPanel())
    {
        <h2>@Html.LabelFor(m => m.assessments)</h2>
        Html.RenderAction("Edit", "Assessments");
    }
    using (tabs.BeginPanel())
    {
        <h2>@Html.LabelFor(m => m.groups)</h2>
        Html.RenderAction("Edit", "Groups");
    }
}

在每个选项卡上,我都放置了部分通知:

@{
    string successMsg = (string)TempData["successMsg"];
    string infoMsg = (string)TempData["infoMsg"];
    string warnMsg = (string)TempData["warnMsg"];
    string errMsg = (string)TempData["errMsg"];

    if (errMsg != null && errMsg != "")
    {
        @Html.Bootstrap().Alert(errMsg).Style(AlertColor.Danger)
    }
    if (warnMsg != null && warnMsg != "")
    {
        @Html.Bootstrap().Alert(warnMsg).Style(AlertColor.Warning)
    }
    if (successMsg != null  && successMsg != "")
    {
        @Html.Bootstrap().Alert(successMsg).Style(AlertColor.Success)
    }
    if (infoMsg != null  && infoMsg != "")
    {
        @Html.Bootstrap().Alert(infoMsg).Style(AlertColor.Info)
    }
}

我希望能够在我的控制器中执行诸如TempData["infoMsg"]="This is a draft copy, you can commit changes by saving or roll back by reverting" 之类的操作,但我只希望它应用于特定视图(选项卡)——使用我当前的方法,所有视图都将显示该消息,因为它指向到TempData

如何将消息引导到正确的页面?我想过以某种方式添加“forPage”参数,但我不确定如何修改部分以在不使用更多 TempData 的情况下接受它,这不会解决问题。

【问题讨论】:

  • 我还应该提到,每个选项卡都有自己独特的 div w/id,并且正在使用 ajax 重新加载以进行提交/恢复/等。发送消息的控制器是子页面(例如CourseController)而不是父控制器。
  • 在 MVC 中可能有一种方法可以做到这一点,但我会用 javascript 的方式来解决这个问题。在页面加载时检查每个选项卡的 errMsg(可能是隐藏的表单值),然后使用 jQuery 更改特定选项卡内的值。

标签: javascript jquery asp.net-mvc twitter-bootstrap tabs


【解决方案1】:

最终将字符串模型添加到部分,然后调用 RenderAction:

局部视图:

@model string
@{
    string successMsg = Model == null ? (string)TempData["successMsg"] : (string)TempData[Model + "SuccessMsg"];
    string infoMsg = Model == null ? (string)TempData["infoMsg"] : (string)TempData[Model + "InfoMsg"];
    string warnMsg = Model == null ? (string)TempData["warnMsg"] : (string)TempData[Model + "WarnMsg"];
    string errMsg = Model == null ? (string)TempData["errMsg"] : (string)TempData[Model + "ErrMsg"];

//the rest as above

控制器动作:

    public ActionResult NotificationPartial(string forPage)
    {
        return PartialView("_NotificationPartial", forPage);
    }

视图调用:

@{Html.RenderAction("NotificationPartial", "Home", new {forPage = "baselineData"});}

控制器传递消息:

TempData["baselineDataSuccessMsg"] = "Baseline Data Saved.";

【讨论】:

  • ***注意:在这个改变之后,我不能再打电话给@Html.Partial(...)了。最终使用视图中的相同调用,但将 null 传递给触发逻辑。
猜你喜欢
  • 2014-05-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-07-11
  • 1970-01-01
  • 2018-06-08
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多