I want to conditionally link a CSS file base on the user's Membership role. An administrator should link my admin.css file while everybody else (other roles and anonymous users) should display my global.css file. Can this be done?
A:
Either you can create theme based on the role - AdminTheme (will contain admin.css) & GlobalTheme (will contain global.css), or else you can dynamically write the <link> element in the <head> tag after giving the runat="Server" attribute to it.
You can then set the page's theme dynamically in the PreInit or Init event based on the role.
Kirtan
2009-04-15 15:56:35
A:
Sure, when you're outputting the <head> section, have an if statement check a session variable that has their "user level", then output the corresponding <link> tag (or @import line, depending how you prefer to do your CSS).
Chad Birch
2009-04-15 15:56:38
+4
A:
Try this:
protected void Page_Init(object sender, EventArgs e)
{
HtmlLink css = new HtmlLink();
// add conditional logic to add correct css file
css.Href = "css/fancyforms.css";
css.Attributes["rel"] = "stylesheet";
css.Attributes["type"] = "text/css";
css.Attributes["media"] = "all";
Page.Header.Controls.Add(css);
}
Michael Haren
2009-04-15 15:56:54
Got this error: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
Mike C.
2009-04-15 16:11:52
I find I get this error because I also declare my javascript files in my header as so: <script src="<%= Page.ResolveUrl("~/common/javascript/panels.js") %>" language="javascript" type="text/javascript"></script>
Mike C.
2009-04-15 16:15:57
If you are going to use the <%%> syntax, you could put the conditional logic for your CSS include in the same place
Michael Haren
2009-04-15 16:47:19
I made this work, but the unintentional side effect is that I can't pull up the design view with the CSS applicable. Bleh. I guess I should be careful what I ask for.
Mike C.
2009-04-15 20:14:11
Mike- I think you could mostly remedy that by including the global.css always--for everyone, and only selectively including the admin.css for admins.
Michael Haren
2009-04-21 11:08:29
A:
If you set the head element of your page to run server-side, you can inject a new HtmlGenericControl into the header that represents the link if the user is in a particular role.
pmarflee
2009-04-15 15:58:25
A:
If you wish to enable/disable/show/hide controls based on the role this would be nothing more than "security by obscurity" since switching off styles or setting a browser to a specific css file to override what is actually served would easily display all that is secret.
Another issue would be caching. Some browsers like Opera/Firefox happily cache all that is cacheable, so the user will have to click "Reload page". You can probably disable caching but then your css will be downloaded all over again thus unnecessarily consuming traffic.
User
2009-04-15 16:13:40
I agree and thanks for the info. However, this is for aesthetic purposes only. I appreciate the note though so I don't try to use the same method in the future and have the issues you mention.
Mike C.
2009-04-15 16:24:09