Adding css class through aspx code behind
If you want to add attributes, including the class, you need to set runat="server"
on the tag.
<div id="classMe" runat="server"></div>
Then in the code-behind:
classMe.Attributes.Add("class", "some-class")
How to add an additional css class from code behind using ASP.NET?
Add additional CssClass like this:
txt.CssClass = txt.CssClass + " Error"
The above can also be abbraviated as:
txt.CssClass += " Error"
Add CSS class to a div in code behind
What if:
<asp:Button ID="Button1" runat="server" CssClass="test1 test3 test-test" />
To add or remove a class, instead of overwriting all classes with
BtnventCss.CssClass = "hom_but_a"
keep the HTML correct:
string classname = "TestClass";
// Add a class
BtnventCss.CssClass = String.Join(" ", Button1
.CssClass
.Split(' ')
.Except(new string[]{"",classname})
.Concat(new string[]{classname})
.ToArray()
);
// Remove a class
BtnventCss.CssClass = String.Join(" ", Button1
.CssClass
.Split(' ')
.Except(new string[]{"",classname})
.ToArray()
);
This assures
- The original classnames remain.
- There are no double classnames
- There are no disturbing extra spaces
Especially when client-side development is using several classnames on one element.
In your example, use
string classname = "TestClass";
// Add a class
Button1.Attributes.Add("class", String.Join(" ", Button1
.Attributes["class"]
.Split(' ')
.Except(new string[]{"",classname})
.Concat(new string[]{classname})
.ToArray()
));
// Remove a class
Button1.Attributes.Add("class", String.Join(" ", Button1
.Attributes["class"]
.Split(' ')
.Except(new string[]{"",classname})
.ToArray()
));
You should wrap this in a method/property ;)
Add CSS class dynamically in code behind using c#
If you don't want to do this server side you can do it via some jQuery which in my opinion is much cleaner. Add this to your masterpage:
<script type="text/javascript">
$(document).ready(function() {
if(window.location.pathname.indexOf('dashboard.aspx') > 0)
{
$('#wrapper').addClass('contnav_bg');
}
});
</script>
It will look at the current url and only apply the class if it the user is on the dashboard.aspx
page.
Alternatively, place the code directly in the dashboard.aspx
template only, instead of putting it in the master page:
<script type="text/javascript">
$(document).ready(function() {
$('#wrapper').addClass('contnav_bg');
});
</script>
adding css class from code behind on page load asp.net C# using javascript
This could be one of 2 problems (or both combined).
The first is that since you're using
jquery
to get the element
reference,jquery
will need to already be loaded on the page i.e.
you probably couldn't run this script on page load because chances
arejquery
will not have loaded in the DOM by that point. You could change to purejavascript
to test if this is the issue. The javascript below should do the same as the jquery.// create a string for the javascript we want to run on the page:
string javascriptCode = @"var element = document.getElementById(""pendingTask""); element.classList.add(""tab-pane"", ""fade-in"", ""active"");";
ScriptManager.RegisterStartupScript(this.GetType(), "MyScript", javascriptCode, true);The problem could be the use of
ScriptManager.RegisterStartupScript
rather thanClientScript.RegisterStartupScript
.Scriptmanager.RegisterStartupScript
should be used in anUpdatePanel
for asynchronous postback. Here you just want to run a
script and insert it from the code behind,ClientScript.RegisterStartupScript
will do that for you.Check the documentation here. The method signature for
ClientScript
is:public void RegisterStartupScript (Type type, string key, string
script, bool addScriptTags);Update the code behind to this:
ClientScript.RegisterStartupScript(this.GetType(), "MyScript",
"<script type=text/javascript> $('#pendingtask').addClass('tab-pane fade in active');</script>",
false);
How to add CSS class to asp.net from code behind
When the generated html output of the row has the class, then there is the css file not linked in the html file, or you have a typo in the class name.
How to add two CSS Class to control in the code behind?
The Add method is actually a Put, since it replaces the value behing the key "class"
. In HTML/css you can have several classes by separating with a space.
txtBox.Attributes.Add("class", "myClass1 myClass2");
ASP.NET Trying to add css class to tr in codebehind
Assuming you have your Checkboxes inside of a HTML-TableRow and you want to set the CSS-Class of the TR
in the CheckedChanged-Event:
This is an example(note that the TR
's have a runat="server"-tag
):
<table>
<tr ID="TR1" runat="server">
<td>
<asp:CheckBox ID="CheckBox1" OnCheckedChanged="isDirector_CheckedChanged" AutoPostBack="true" runat="server" />
</td>
</tr>
<tr ID="TR2" runat="server">
<td>
<asp:CheckBox ID="CheckBox2" OnCheckedChanged="isDirector_CheckedChanged" AutoPostBack="true" runat="server" />
</td>
</tr>
<tr ID="test" runat="server">
<td>
<asp:CheckBox ID="CheckBox3" OnCheckedChanged="isDirector_CheckedChanged" AutoPostBack="true" runat="server" />
</td>
</tr>
</table>
and this is the codebehind:
protected void isDirector_CheckedChanged(object sender, EventArgs e)
{
//var row = (HtmlTableRow)((CheckBox)sender).Parent.Parent;
test.Attributes("class") = "CssClass";
}
Edit: if your tr's
are runat="server"
and they have unique ID's, you can access them directly
Related Topics
Concatenate Values in Less (Css) Without a Space
Why Do I Have to Put Media Queries at the Bottom of the Stylesheet
Ignoring Webkit-Specific CSS Selector in Firefox
How to Keep Aspect Ratio of a Background-Image
Align Material Icon with Text on Materialize
Absolute Position Affects Width
How to Use CSS to Replace or Change Text
CSS Media Type: How to Load CSS for Mobile
Can You Add Line Breaks to the :After Pseudo Element
IE7 CSS Inheritance Does Not Work
Cannot Get Bootstrap 4 Horizontal Form to Work as Required
Flexbox Adding Newline to Clipboard
Styling Checkboxes, Radio Buttons and Dropdowns
Why Shouldn't I Use Id Selectors in CSS