CODEWITHSUNDEEP
jqueryasp.net
suganyag
suganyag

Reputation: 13

How to enable and disable the css applied for linkbutton

I got 4 link button where i need to change the color of onclicked

Example :A B C D

By default apply css to A if B is clicked Apply it to B.css applied for the A Button should disable. I need the solution in server side or in client side.

I need the solution in the server side as i got updated panel and i am calling the linkbutton text in code behind

Upvotes: 0

Views: 803

Answers (2)

Michael Coxon
Michael Coxon

Reputation: 5520

Your question is very vague and does not contain code but I will try my best. It sounds like you want to toggle classes between elements. This can be achieved as below:

ASP.NET

<asp:LinkButton ID="lbA" Text="A" OnClientClick="lbGroupClick" CssClass="lb active" runat= "server" />
<asp:LinkButton ID="lbB" Text="B" OnClientClick="lbGroupClick" CssClass="lb" runat= "server" />
<asp:LinkButton ID="lbC" Text="C" OnClientClick="lbGroupClick" CssClass="lb" runat= "server" />
<asp:LinkButton ID="lbD" Text="D" OnClientClick="lbGroupClick" CssClass="lb" runat= "server" />

Javascript

function lbGroupClick() {
    $('.lb.active').removeClass('active'); // remove from any current active ones
    $(this).addClass('active');
}

Upvotes: 2

Claudio Bredfeldt
Claudio Bredfeldt

Reputation: 1422

HTML

<div class="links-list">
    <a href="#" class="active">Link 1</a>
    <a href="#" >Link 2</a>
    <a href="#" >Link 3</a>
    <a href="#" >Link 4</a>
</div>

JS

$('a', '.links-list').each(function(){
    $(this).click(function() {
        $('a.active', '.links-list').removeClass('active');
        $(this).addClass('active');

        return false;           
    });
});

Upvotes: 0

Related Questions