Dynamically changing the ID of a control

  • Thread starter Thread starter Dunc
  • Start date Start date
D

Dunc

I've got a c# app, and in the HTML in front I have a <div> tag around
some navigation controls, and I want to dynamically change it's ID so
the CSS kicks in and highlights the currently selected option.

Problem is - when you set an ID, it prefixes it with ctl0_ on IIS 5.1
(Windows XP - our dev machines) and ctl00_ on IIS 6.0 (Windows 2003
server - the production machine)

The obvious answer is to create two versions of style stylesheet - one
for dev, one for production. The problem with this is trying to
explain to management why we'd need to modify the CSS outside of
source control every time we deploy it; in short, it's just not going
to happen.

Does anyone know how to override the .net prefix (ctl..), so I can set
the ID of an element with a consistent value?

Code is:

---/ snip /---

<div id="myDiv" runat="server">
<ul>
<li><a href="default.aspx">Home</a></li>
<li><a href="Item1.aspx">Item 1</a></li>
</ul>
</div>

---/ snip /---

string scriptName =
Request.ServerVariables["SCRIPT_NAME"].ToLower(); // get current
script name
string newID = scriptName.SubString(0, scriptname.IndexOf(".")); //
remove extension - home or item1

myDiv.ID = newID; // sets it to ctl0_home or ctl00_home, ctl0_item1 or
ctl00_item1

TIA
 
Hi,

Dunc said:
I've got a c# app, and in the HTML in front I have a <div> tag around
some navigation controls, and I want to dynamically change it's ID so
the CSS kicks in and highlights the currently selected option.
Click to expand...

I'm not sure what the control's ID has to do with the CSS being used. The
Css of a controls is set using CssClass, not ID
Problem is - when you set an ID, it prefixes it with ctl0_ on IIS 5.1
(Windows XP - our dev machines) and ctl00_ on IIS 6.0 (Windows 2003
server - the production machine)

The obvious answer is to create two versions of style stylesheet - one
for dev, one for production. The problem with this is trying to
explain to management why we'd need to modify the CSS outside of
source control every time we deploy it; in short, it's just not going
to happen.
Click to expand...

That is not a good solution , what happen if after an upgrade (of either the
framework or IIS ) the controls are named differentely?
 
You're right - it's not a great idea, but it's the only one I can
think of. The reason I need an ID tag as opposed to just setting a
CssClass is the element also needs to be referenced by some
JavaScript.

Thanks for the feedback, though - got any other thoughts?

Dunc

---/ snip /---
 
Instead of monkeying around with trying to change the control's mangled id,
why not just change the css class attribute? You can do this server side, or
you can even do it client side via javascript.
Peter
 
Hi,

Dunc said:
You're right - it's not a great idea, but it's the only one I can
think of. The reason I need an ID tag as opposed to just setting a
CssClass is the element also needs to be referenced by some
JavaScript.
Click to expand...

But that is different, it's not the same knowing in the client the ID of a
given control than wanting it to change dynamically.

You can use a variable to hold the assigned clientID of the control, y ou
could do something like:

Controls.Add( new LiteralControl( "<script> var myControl = '" +
yourControl.ClientID + "'; </script>:" );

now in the client you can reference it like:

<script>
function DoIt()
{
var control = document.getElementByID( myControl);
control.class = "theCSSClass";
}
</script>
 
Back
Top