Once again, how do I convert ct100 IDs to original id using javascript?

Question

I have a tag element in .aspx page:

 <a id="loginLink" runat="server" class="loginLink" href="#" onclick="$('registerform').hide(); $('signin').show(); this.style.display='none';   $('back').show(); $('reg-signin-email').focus(); return false">Already signed up? Log in here</a>

and trying to get loginLink.ClientID , but it spits back ct100_main_loginLink. How do I get original 'loginLink' id in the same aspx page?

Tried var ctrl = document.getElementById('<%# loginLink.ClientID %>'); and it didnt work..

example:

<asp:Content runat="server" ContentPlaceHolderID="Main">

        <a id="loginLink" runat="server" class="loginLink" href="#" onclick="$('registerform').hide(); $('signin').show(); this.style.display='none';   $('back').show(); $('reg-signin-email').focus(); return false">Already signed up? Log in here</a>

        <script type="text/javascript">   alert('diplay here original loginLink ID instead of ct100_Main_LoginLink');  </script>
</asp:Content>

Answer 1

You need to write '<%# loginLink.ClientID %>', and you can only write it in the original ASPX page. (Not an external JS file)

If you wnat to get the original ID (which never shows up on the client), use loginLink.ID.

Answer 2

if you use a tool like FireBug you will see that the actual ID output to the client is the long one with ct100.... in ASP.NET pages.

You will not normally get loginlink back to the client unless you are using Dot.NET 4.0 and controlling the client-mode.

in your example the var ctrl should hold a reference to the DOM element

Answer 3

if you know the name, and that's what you want to have available in js, you can just type it in js. alternatively, if you want the control to provide its own id, you could do

<script type="text/javascript">   
  alert('<% =loginLink.ID %>');  
</script> 

although I don't see the point in that. if you need to grab the element during a javascript routine, you'll need the ClientID value as there won't be any element on the page with the short-form id in the example I've given.