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?
Add a comment
|
5 Answers
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);
}
5 Comments
Mike Cole
Got this error: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
Mike Cole
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>
Michael Haren
If you are going to use the <%%> syntax, you could put the conditional logic for your CSS include in the same place
Mike Cole
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.
Michael Haren
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.
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.
Comments
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).
Comments
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.
Comments
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.
1 Comment
Mike Cole
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.