Manoj Kumar
Manoj Kumar

Reputation: 901

Why Jquery is not working for CssClass property of LinkButton in asp.net?

I have this code:

jquery:

$(".clr").click(function () {
            $(".clr").each(function () {
                $(this).parents("li").css("background", "#000")
            })
            var color1 = "#f8ac00";
            $(this).parents("li").css("background", color1);
        });

ASP.NET:

 <ul id="css3menu1" class="topmenu">

                    <li class="topfirst">
                        <asp:LinkButton ID="lnkbtn_dashbd" CssClass="clr" Height="18" Width="100" runat="server">Dashboard</asp:LinkButton>
                    </li>
                    <li class="topmenu">

                        <asp:LinkButton ID="lnkbtn_events" CssClass="clr" Height="18" Width="100" runat="server">Events</asp:LinkButton>

                    </li>
                    <li class="topmenu">
                        <asp:LinkButton ID="lnkbtn_myaccount" CssClass="clr" Height="18" Width="100" runat="server">My Account</asp:LinkButton>


                    </li>


                    <li class="toplast">
                        <asp:LinkButton ID="lnkbtn_abtus" CssClass="clr" Height="18" Width="100" runat="server">About Us</asp:LinkButton>
                    </li>
                </ul>

Image reference: Menu

I have defined CssClass property of LinkButton, mapping it to Jquery class. But on click, this code is not working. I don't know why? Please help me.

Upvotes: 0

Views: 145

Answers (1)

iCollect.it Ltd
iCollect.it Ltd

Reputation: 93601

Aside from not knowing what behavior you are getting from the button clicks (page postback?), these are just my suggestions put together for you to try.

Please try the following as a test:

   $(".clr").click(function (e) {
        // Stop the click behavior for now (postback?)
        e.preventDefault();

        // Turn off all the LIs
        $("li:has(.clr)").css("background", "#000");

        // Turn on the closest LI to the clicked linkButton
        var color1 = "#f8ac00";
        $(this).closest("li").css("background", color1);
    })

Upvotes: 1

Related Questions