assigning css class to a linkbutton when clicked in asp.net.

Question

Consider i have 3 linkbuttons on a page,

<asp:LinkButton ID="LB1" runat="server" CssClass="regular" OnClick="LB1_Click">
      Today</asp:LinkButton>
 <asp:LinkButton ID="LB2" runat="server" CssClass="regular" OnClick="LB2_Click">
      Today</asp:LinkButton>
 <asp:LinkButton ID="LB3" runat="server" CssClass="regular" OnClick="LB3_Click">
      Today</asp:LinkButton>

I want to highlight a linkbutton on its click with a css and then remove its css when another linkbutton is clicked (ie) i want to show active link button. Any suggestion.

Answer 1

In Page_Load, you set the css class of all the linkbuttons to default class

LB1.CssClass = "StandardClass";
LB2.CssClass = "StandardClass";

....

And in the Btn_Click event of each LinkButton, you set its css class to the "Active" css

Eg : If LB1 is clicked then within LB1_Click

LB1.CssClass = "ActiveClass";

This seems straight forward enough. Hope i am not mis-understanding something in your question.

Answer 2

I'm using jquery-ui and I assign a class abtn to each button (input type=submit or a href)

I'n the page load I execute this:

function dobuttons() {
        $(".abtn").hover(
            function () {
                $(this).addClass("ui-state-hover");
            },
            function () {
                $(this).removeClass("ui-state-hover");
            }).bind({

                'mousedown mouseup': function () {
                    $(this).toggleClass('ui-state-active');
                }

            }).addClass("ui-state-default").addClass("ui-corner-all")
            .bind('mouseleave', function(){$(this).removeClass('ui-state-active')});
    }

you can see live sample here http://mrgsp.md:8080/a/Dossier/Create