Solved

Why does (runat="server") prefix my id tags with ctl100_?

Posted on 2009-05-07
4
1,872 Views
Last Modified: 2012-05-06
In my html document I have a line like:

            <h1 runat="server" id="testText">SAMPLE HEADING</h1>

to dynamically change the inner text at run time in the code behind using:

             this.testText.innerText="NEW HEADING";

....

I want to be able to use CSS to style this heading based on the id tag of "testText"; however at run-time the id name gets prefixed with "ctl100_"

Is there a way to prevent this prefixing?

Using C# and ASP.NET 2.0
0
Comment
Question by:ctl100
  • 2
4 Comments
 
LVL 29

Assisted Solution

by:David H.H.Lee
David H.H.Lee earned 50 total points
ID: 24333117
Hi ctl100,
This is .net interpreted id after rendered in HTML version. If you're trying to refer the id in javascript based on rendered ID, you can check its client ID instead.
eg:
<script>
var obj;
obj=document.getElementById('<%= testText.ClientID%>');
obj.className='yourCssClassID';
</script>

Lastly, you can't prevent the prefix include inside the rendered ID. That is spontaneous behavior for the page that running under .net framework.

0
 

Author Comment

by:ctl100
ID: 24333121
So, there is no way to stop .NET from prefixing?
0
 
LVL 9

Accepted Solution

by:
tetorvik earned 200 total points
ID: 24333147
It's .NET Framework that prefixes controls to identify them uniquely. Each control that implements INamingContainer prefixes child controls with its own id.
Therefore ids can grow very large and become unusable in many circumstances. I don't think there is a workaround for that until ASP.NET 4.0 comes in.
http://weblogs.asp.net/asptest/archive/2009/01/06/asp-net-4-0-clientid-overview.aspx

So until them I would engourage to identify your style with CSS classes.
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 24333160
Hi tetorvik,
Good approach for the incoming .net 4.0 framework. Thanks for sharing thought here.
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

713 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question