Add CSS Class to a Div in Code Behind

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 ;)

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"

After adding one css class to div in Code Behind existing class disappear

concatenate the existing class with the new one

DivID.Attributes.Add("class", DivID.Attributes["class"] + " SecondCssClass");

Set the css class of a div using code behind

C#

divControl.Attributes["class"] = "myClass";

VB

divControl.Attributes("class") = "myClass"

You'll need to have a rule like this one on your css file

.myClass
{
   height:200px; 
   /*...more styles*/
}

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).

1. 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
   are jquery will not have loaded in the DOM by that point. You could change to pure javascript 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);
   

2. The problem could be the use of
   ScriptManager.RegisterStartupScript rather than
   ClientScript.RegisterStartupScript.
   Scriptmanager.RegisterStartupScript should be used in an
   UpdatePanel 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);
   

change css class in code behind

try this way FeedbackLabel.Attributes.Add("Class", "feedback fail")
.

you shouldn't use . for specifying class attribute value for element

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");

---

Related Topics