Access ASP.Net Control ID using jQuery on Content Page

Last Reply 8 months ago By pandeyism

Posted 8 months ago

Hi all

I have a simple content page which references a Master page and has a button on it:

 <asp:Button ID="btnReport" runat="server" Text="Reports" CssClass="btn btn-mainmenu" BackColor="#94B8B8" />

I also have a Jquery function:

<script type="text/javascript">
    $(document).ready(function () {
            $("<%=btnReport.ClientID%>").click(function() {
            alert("Alert using jQuery");
        });
    });
</script>

However, when I click on the button, the Jquery is not executed. I have checked the page source and discovered the following rendered HTML:

<input type="submit" name="ctl00$MainContent$btnReport" value="View Reports" id="MainContent_btnReport" class="btn btn-mainmenu" style="background-color:#94B8B8;" />

This is the Jquery function:

<script type="text/javascript">
    $(document).ready(function () {
        $("MainContent_btnReport").click(function() {
            alert("Alert using jQuery");
        });
    });
</script>

As you can see, the rendered input name (ctl00$MainContent$btnReport) is not the same as the name of the button in the JQuery function (MainContent_btnReport). Is this why the function is not being executed?

Posted 8 months ago
Sanxion says:
$("<%=btnReport.ClientID%>").click(function() {

 Replace above code with below code-

$("#<%=btnReport.ClientID%>").click(function () {