2

上一篇文章中,我在视图上设置样式时遇到了麻烦,就像他们在Telerik 演示网站上通过从下拉列表中选择样式一样。这得到了回答,但是我现在有一个新的但相关的问题。

我的网站上有多个页面(对于 MVC 来说很常见),每个页面上都有许多 Telerik 控件。允许用户使用为我完成的预定义 css 设置网站样式非常棒,并且为我节省了大量工作。

问题是当我从一个页面移动到另一个页面时,telerik 使用的组合框会重置为其默认值,因此每次用户更改页面时都会重置网站上的样式(不理想)。

我曾尝试使用会话来存储状态,但无法像标准 aspx 开发那样检测回发。所以我不能做类似的事情:

if(isPostBack)
{
    if(string.isNullOrEmpty(Session["MyTheme"]+""))
    {
        Session["MyTheme"]="black";
    }
    else
    {
        Session["myTheme"]=//Some combo box selected value
    }
}

即使我可以,组合框 onChange 事件也是通过 JavaScript 处理的,但 Telerik 控件需要 C# Razor 并在我尝试时,我无法让他们交谈并分享一个简单的值。

最终,我想做的就是让用户从组合框中选择一个主题,然后从那时起,该主题将在整个站点中被记住,直到他们下一次更改它。

我已经尝试过查询字符串和会话,但都无法使用,因为我无法在 JavaScript 中访问它们。显然,它们仅用于服务器端。

我已经尝试过 cookie,但这不起作用,因为我无法在 C# Razor 中访问它们。Aparently 他们只是客户端。

下面是我的代码:

<head>
@(
  Html.Telerik().StyleSheetRegistrar()
                .DefaultGroup(group => group
                .Add("telerik.common.css")
                .Add(string.IsNullOrEmpty(@Html.ViewContext.HttpContext.Request.QueryString["theme"]) ? "telerik.black.css" : "telerik."+@Html.ViewContext.HttpContext.Request.QueryString["theme"]+".css").Combined(true).Compress(true)
                ))
</head>


<body>
                    @(
                        /* TELERIK COMBOBOX */

                        Html.Telerik().ComboBox()
                        .Name("cbxTheme")
                        .SelectedIndex(0)
                        .ClientEvents(events => events.OnChange("cbxTheme_onChange"))
                        //.BindTo((IEnumerable<DropDownItem>)ViewData["Files"])
                        .Items(item =>
                            {
                                item.Add().Text("black");
                                item.Add().Text("common");
                                item.Add().Text("default");
                                item.Add().Text("forest");
                                item.Add().Text("hay");
                                item.Add().Text("metro");
                                item.Add().Text("office2007");
                                item.Add().Text("office2010black");
                                item.Add().Text("office2010blue");
                                item.Add().Text("office2010silver");
                                item.Add().Text("outlook");
                                item.Add().Text("rtl");
                                item.Add().Text("simple");
                                item.Add().Text("sitefinity");
                                item.Add().Text("sunset");
                                item.Add().Text("telerik");
                                item.Add().Text("transparent");
                                item.Add().Text("vista");
                                item.Add().Text("web20");
                                item.Add().Text("webblue");
                                item.Add().Text("windows7");
                            })
                    )

@(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Combined(true).Compress(true)))

</body>

<script type="text/javascript">
function cbxTheme_onChange()
{
    var selectedItemText = $("#cbxTheme").data("tComboBox").text();
    //var selectedItemValue = $("#cbxTheme").data("tComboBox").value();
    window.location.href = window.location.protocol
                         + '//'
                         + window.location.host
                         + window.location.pathname
                         + '?theme='
                         + selectedItemText;
}
</script>

正如我所解释的,在大多数情况下它工作正常。当我单击另一个页面的链接时执行。然后一切都被设置回预设的默认值。

理想情况下,我正在寻找一种在组合框中选择新项目时进行回发的方法(如在 JavaScript 中)。样式已更改,因此无论如何都需要刷新整个页面。这行得通。但是当我移动到另一个页面时,它会重置为默认样式。所以我需要一种方法来存储客户端或服务器端的选定样式(最好是这样加载我的页面)。

我已经读过这可以通过使用控制器来完成,但不清楚如何。如果可能的话,我想要控制器方法,因为我将使用控制器动态加载 CSS 样式列表,允许用户下载其他样式,它们将自动添加到列表中。所以沿着这条线的任何东西都会很棒。

4

1 回答 1

2

您可以创建一个具有静态属性的静态类,该静态属性将充当全局属性。

public static class MyTheme
{
    public static string MyGlobalTheme { get; set; }
}

或者你可以应用程序类。

Application["MyTheme"] = "black";

您可以将此代码放在 _Layout.cshtml 中。如果您的项目名称是 TProj,并且您的静态类位于名为 Objects 的文件夹中,则它看起来像这样。

_Layout.cshtml

@{
  if (@Html.ViewContext.HttpContext.Request.QueryString["theme"] != null)
  {
    TProj.Objects.MyTheme.MyGlobalTheme = Html.ViewContext.HttpContext.Request.QueryString["theme"];
  }
  else
  {
    if (TProj.Objects.MyTheme.MyGlobalTheme == null)
    {
      TProj.Objects.MyTheme.MyGlobalTheme = "black";
    }
  }
}

现在在 _Layout.cshtml 中,您可以使用字符串 @TreasuryReportsMvc.Objects.MyTheme.MyGlobalTheme,即使您转到另一个页面,它也应该保持不变。_Layout.cshtml 可能不是这个逻辑的最佳位置。您应该考虑对您的项目最有意义的地方。

请注意,许多人不赞成全局变量。这个问题很好地讨论了 Asp.Net MVC 全局变量。

于 2012-06-28T18:24:38.327 回答