CODEWITHSUNDEEP
javascriptjqueryasp.net
akvickyit7
akvickyit7

Reputation: 225

Why Div is not visible on button click

in my webpage i set visibility of a div hidden and i want to show it on button click,so i am writing a jquery code for it. but some how it is not working my asp code is

<asp:Button ID="btnGenerate" CssClass="button" runat="server" Text="Generate" OnClick="btnGenerate_Click" />
<div id="print" style="width: 80%; margin-left: 10%; margin-top: 20px;visibility:hidden;">                
    <input type="button" id="btnPrint" class="button" value="Print" onclick="printDiv('ReportDiv')"/>
</div>

and my jquery code for it is:

 <script>
    $(document).ready(function () {
        $("#btnGenerate").click(function () {
            $("#print").css("visibility", "visible");
        });
    });
</script>

please help me to fix this issue. Thanks

Upvotes: 1

Views: 980

Answers (4)

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

Because .net will change the id while rendering, being runat server. You should use class for that

$(document).ready(function () {
    $(".button").click(function () {
        $("#print").css("visibility", "visible");
    });
});

Upvotes: 0

Govinda Rajbhar
Govinda Rajbhar

Reputation: 3034

try it

<script>
      $(document).ready(function () {
          $("#<%= btnGenerate.ClientID %>").click(function () {
             $("#print").css("visibility", "visible");
          });
      });
</script>

you can not get asp.net button click in jquery using $("#btnGenerate") if you want to use asp.net button in jquery then you will have to use like this $("#<%= btnGenerate.ClientID %>")

Upvotes: 0

Awlad Liton
Awlad Liton

Reputation: 9351

child element will not be visible until his parent element is visible. So you need to show parent div.

Here parent div #print is hidden and you are trying to show its child div #btnPrint you have to make parent div #print visible.

try this:

$(document).ready(function () {
        $("#btnGenerate").click(function () {
            $("#print").css("visibility", "visible");
        });
    });

Upvotes: 0

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67207

Because you gave a wrong ID, Look at your html <div id="print" ...

$(document).ready(function () {
    $("#btnGenerate").click(function () {
        $("#print").css("visibility", "visible");
    });
});

Upvotes: 1

Related Questions