CODEWITHSUNDEEP
c#jqueryhtmlcssasp.net
Carmen C
Carmen C

Reputation: 55

C# ASP.NET How to modify CSS class via code-behind

So just like the title, how to modify the CSS class via code-behind? For example the following code

                    <li class="active"><a href="pages-messages.html"><span class="fa fa-comments"></span> Messages</a></li>
                    <li><a href="pages-calendar.html"><span class="fa fa-calendar"></span> Calendar</a></li>
                    <li><a href="pages-tasks.html"><span class="fa fa-edit"></span> Tasks</a></li>
                    <li><a href="pages-content-table.html"><span class="fa fa-columns"></span> Content Table</a></li>
                    <li><a href="pages-faq.html"><span class="fa fa-question-circle"></span> FAQ</a></li>
                    <li><a href="pages-search.html"><span class="fa fa-search"></span> Search</a></li>

The code above is navigation for my HTML page and the first line has li class="active", how to change it into just li and the second row which is pages-calender change it into li class="active" ?

Thanks

Upvotes: 0

Views: 3759

Answers (1)

Pavel Dmitrenko
Pavel Dmitrenko

Reputation: 310

If you are using WebForms, then add runat="server" attributes and set unique id attribute for each li tag you need to modify in code-behind. Addition of this tags is needed to enable programmatic access from code-behind to the HTML element.

For example:

<li runat="server" id="PagesMessages" class="active"><a href="pages-messages.html"><span class="fa fa-comments"></span> Messages</a></li>
<li runat="server" id="PagesCalender"><a href="pages-calendar.html"><span class="fa fa-calendar"></span> Calendar</a></li>

Then in code-behind:

PagesMessages.Attributes["class"] = string.Empty;
PagesCalender.Attributes["class"] = "active";

Upvotes: 5

Related Questions