Question

我正在使用javascript在ASP.net MVC应用程序中工作。我正在使用devExpress dxSwitch来尝试更改页面的主题。

我的代码在我的_layout.cshtml

中

    @Html.DevExpress().GetStyleSheets( "dark",
    new StyleSheet { ExtensionSuite = ExtensionSuite.NavigationAndLayout },
    new StyleSheet { ExtensionSuite = ExtensionSuite.Editors },
    new StyleSheet { ExtensionSuite = ExtensionSuite.GridView },
    new StyleSheet { ExtensionSuite = ExtensionSuite.Dashboard}
)

而不是硬编码“黑暗”的主题我想看看我是否可以使用变量代替它并应用此功能在明暗之间切换。

$('#switch').click(function () {


            var whichTheme = $("#switch").dxSwitch("instance");
            var valueSwitch = whichTheme.option("value");
            if (valueSwitch === true) {

                $('body').css('background-color', '#343434');

            } else {

                $('body').css('background-color', 'whitesmoke');
            }
        });

Answer 1

我认为你没有机会这样做。 Javascript和Razor之间没有沟通，因为渲染发生在jQuery开始工作之前。

我会查看来自DevExpress的输出HTML，然后在元素本身或页面上的样式标记中添加或更改样式。

Answer 2

看起来你想要的是这样的https://codecentral.devexpress.com/E3825/Home/PostTheme，你可以这样做，但它并不像你想象的那么简单，请查看这个示例代码

namespace MvcApp_Theme {
    // Note: For instructions on enabling IIS6 or IIS7 classic mode, 
    // visit http://go.microsoft.com/?LinkId=9394801

    public class MvcApplication : System.Web.HttpApplication {
        public static void RegisterGlobalFilters(GlobalFilterCollection filters) {
            filters.Add(new HandleErrorAttribute());
        }

        public static void RegisterRoutes(RouteCollection routes) {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
            routes.IgnoreRoute("{resource}.ashx/{*pathInfo}");

            routes.MapRoute(
                "Default", // Route name
                "{controller}/{action}/{id}", // URL with parameters
                new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
            );

        }

        protected void Application_Start() {
            AreaRegistration.RegisterAllAreas();

            RegisterGlobalFilters(GlobalFilters.Filters);
            RegisterRoutes(RouteTable.Routes);
        }

        protected void Application_PreRequestHandlerExecute(object sender, EventArgs e) {
            DevExpressHelper.Theme = Utils.CurrentTheme;
        }
    }
}

此链接https://www.devexpress.com/Support/Center/Example/Details/E3825/how-to-change-a-theme-on-the-fly

中包含完整代码

DevExpress获取样式表添加变量

2 个答案: