jquery toggle() not working on content page

Question

I am wondering why below code is not working. Could anybody of you help me, please?

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#button").click(function () {
                $("#hide").toggle();
            });
        });
    </script>
    <asp:Button ID="button" runat="server" Text="button" OnClientClick="return false" />
    <div id="hide">
    <asp:Button ID="show" runat="server" Text="example" />
    </div>
</asp:Content>

EDIT: What in case when the button is in gridview or nested gridviev? When I use
$("#<%= button.ClientID %>") it returns me an error: "The name 'button' does not exist in the current context." Will you be able to help me in that case?

It's a div id; that isn't the problem. OP - what exactly do you mean by "not working"? What is or isn't happening? — EmmyS, Nov 21 '13 at 15:01
I would agree with Jason ASP.net is changing your ID property. — Agile Jedi, Nov 21 '13 at 15:09

Khanh TO · Answer 1 · 2013-11-26T03:21:35.537

4

Try:

$("#<%= button.ClientID %>").click(function () {
    $("#hide").toggle();
});

edited Nov 26 '13 at 03:21

answered Nov 21 '13 at 15:00

Khanh TO

48,509
13
99
115

hide is not a server element. – Enam Nov 21 '13 at 15:02

score 3 · Answer 2 · answered Nov 21 '13 at 15:01

3

Try this:

$("#<%= button.ClientID %>").click(function () {
     $("#hide").toggle();
});

answered Nov 21 '13 at 15:01

Enam

1,268
1
9
16

score 1 · Accepted Answer · edited May 23 '17 at 11:56

1

This is answered elsewhere: How to stop ASP.NET from changing IDs in order to use jQuery

ASP.Net is not writing out the ID for the button as you would expect.

edited May 23 '17 at 11:56

Community

1
1

answered Nov 21 '13 at 15:10

Agile Jedi

2,922
2
18
17

jquery toggle() not working on content page

3 Answers3