JQuery and ASP.NET Control issues

Just wire up the click event in jQuery.

$(document).ready(function() {
    $(id of the input control)click(function() {
        alert('hey!');
    });
});

      

        
        
        
      

    

Also, make sure that you are not just pasting the ID injected into the control in jQuery. ASP.Net renders a control with a much larger ID than you gave the control to. On one of the sites running, I have the following button:

<asp:Button ID="btnSignup" runat="server" Text="Sign Up" />

      

        
        
        
      

    

The id in the rendered HTML is not btnSignup, it actually appears as ctl00_cpLeft_btnSignup. To select this control using jQuery, you can do this:

$("input[id$='btnSignup'").click(function() { ... });

      

        
        
        
      

    

Edit:

$("input[id$='btnSignup'}").click(function() { ... });

      

        
        
        
      

    

You can also choose using:

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

      

        
        
        
      

    

Edit:

I looked into using the <% = ...%> method and you would need to have your javascript IN ASPX / ASCX file for it to work. Because of this, I am sticking with the regex method.

Selecting a generated ASP.NET id with jQuery

Is your ASP.NET control on a master page or a custom control? ASP.NET will add a bunch of IDs to your ID to make sure it's unique.

What is the id of the control exiting as in HTML?

If you are setting the ID of the rendered HTML control to the ID provided to the ASP.NET control, you need to know how ASP.NET handles the ID namespaces. Basically, every control nested within a control must always guarantee a unique identifier. ASP.NET supports this by taking the ID assigned to the control and adding it with the ID of each control that contains the control. Thus, the control on the page will contain a string of IDs going up the form on the page itself.

You don't want to rebuild this client side. Instead, Control defines a ClientID, which returns the identifier of the control that is displayed on the client. Paste this into your jQuery, or into a javascript variable that your jQuery can see if you put jQuery in a separate script file) and you should be fine.

just to tell you that the document.ready part is not needed , using asp.net control, the id is changed to something other than what is expected by ct100 .... is thrown at the beginning of it, so this path will look the actual name of the identifier, although asp.net is throwing malformed code at the beginning because it looks for all elements (*) that have an identifier that ends with the specified text.

$(function() {
   $("*[id$='idofcontrol']".click(function() { alert('hey!'); });
});

      

        
        
        
      

    

or go to view source and copy id name and paste in your code or just use css class selector like this:

$(function() {
      $('.myclassname').click(function() { alert('hey!'); });
});