I have a specific control gridview , i apply specific CSS file on it , i wanna to change this CSS under specific condition in my .cs file, is there away to do that?
for example :
<ItemStyle CssClass ="normal"/>
i want to change this in .cs under specific condition.
Do you mean GridView?
It doesn't have and ItemStyle Property. Columns within it do though.
So you can use:
gv.Columns[0].ItemStyle.CssClass = "RedItem";
DataGrid does have an ItemStyle property:
dg.ItemStyle.CssClass = "MoreThanNormalClass";
Its not clear from your question what you want to change...
CSS Classes:
<style>
.Normal{ background-color:Lime; }
.Warning{ background-color:Red; }
</style>
ASP.NET markup:
<asp:DataGrid runat="server" id="dg" onitemdatabound="dg_ItemDataBound" >
<ItemStyle CssClass="Normal" />
</asp:DataGrid>
C# code behind :
protected void Page_Load(object sender, EventArgs e)
{
int[] someInts = { 1, 15, 20 };
dg.DataSource = someInts;
dg.DataBind();
}
protected void dg_ItemDataBound(object sender, DataGridItemEventArgs e)
{
if (e.Item.DataItem != null)
{
int v = (int)e.Item.DataItem ;
if (v > 10 && v < 20)
e.Item.CssClass = "Warning";
}
}
Outputs:
Your styles doesn't have to be in a .css file: You can change the file to an .aspx or maybe create an HttpHandler to serve up your CSS.
You have to get something like this rendered to the HTML page.
<style type="text/css">
.itemstyle
{
/* whatever styles you need */
}
</style>
This can override whatever you have in your CSS file. One option is to put a Literal control on the ASPX page:
<asp:Literal ID="litStyle" runat="server" />
and use that to write out the necessary styles from code behind:
litStyle.Text = "<style type=\"text/css\">.itemstyle{" + myStyles + "}</style>";
You can inject a <style> tag with the necessary adjustments to it onto the page without modifying the CSS file.
Just create a literal control, acting as placeholder for the modified styles, on the ASPX page. From the code-behind, render something similar to the following to the literal:
Literal1.Text = "<style type=\"text/css\">.normal { background-color:red; }</style>";
...with "normal" being the original CSS class that you want to modify. The beauty of CSS is that it would first apply styles set in the included files, then any "overwritten" styles explicitly specified on the page in <style> tags.
Dynamic CSS is generally frowned upon.
You should define two ( or more) classes within your CSS and then set the ClassName property of the element in a PreRender event( or client side) script as needed.
Well, controls aren't responsible of managing CSS source files and its addition to the page, so, the easy answer is no, you can't do that.
By the way, there's some solution for doing that.
You can include a CSS file with style HTML element from your control by adding a server control (HtmlGenericControl, for example), with the apropiate attributes and values, so, if container control requires some specific CSS file, you can add it during container control's life cycle, just before rendering it, to HTML head element (marked with runat="server" attribute) of some ASP.NET page.
Maybe a good way of doing that should be creating a configuration section in your web.config implementing your own one which may support creating dependencies of controls/pages and CSS stylesheet files, so, using this approach, you would be able to implement some method in a derived from System.Web.UI.Page class that may add CSS files depending on controls:
<cssDependencies>
<control type="YourNamespace.YourControl" cssFile="~/Styles/Default/YourControlStyle.css" />
<cssDependencies>
And then, your CustomPageBase would have its own "AddControl" method which should register its type in some collection that may be iterated in the PreRender method, so, there you can add CSS files based on control's types.
I'm just giving you ideas! :)
EDIT & NOTE: Anyway, this approach, and your goal, could have problems in terms of performance optimization.
Best optimized sites should combine all needed CSS into one, so browser should load one instead of many during page renderization.
I believe combining all CSS files into one can be achieved with "CSS files and control types approach", and I would suggest you to go this way, because if you don't do that, you can end with pages having dozens of style elements.
Have you heard about DotLess project? Check it out here: http://www.dotlesscss.org/ Maybe it can give you a better approach with less effort!
The best way would be to have different classes set up in your static css-file and change which of these classes your gridview uses from codebehind (.cs). This way you will still get the benefit of the css being cached and well separated from your view (.aspx).
css:
.normal { background-color:white; }
.alternate { background-color:#EEE; }
codebehind
var css = SomeLogic() ? "normal" : "alternate";
gridView.RowStyle.CssClass = css;
