Adding Client-Side Features to Server Controls

barkerl · February 18th, 2009, 12:10 PM

Hi,

I'm using the OnPreRender method within a Server Control to generate some client side JavaScript, which is to bring focus to a textbox. The method is as follows:

Code:

protected override void OnPreRender(EventArgs e)
{
Page.ClientScript.RegisterStartupScript(typeof(Page),
"ControlFocus", "document.getElementById('" + this.ClientID + 
"').focus();", true);
}

When the web page is displayed, the page source (relevant bits) is as follows:

Code:

<html>
....
<div>
<span id="WebCustomControl1_1" style="display:inline-block;background-
color:Green;font-weight:bold;height:28px;width:152px;">
 <div>
   <input type="text" id="WebCustomControl1_1" name="WebCustomControl1_1"
   value="Hello Skin" id="WebCustomControl1_1" style="display:inline-block;
   background-color:Green;font-weight:bold;height:28px;width:152px;" />
 </div>
</span>
</div>
 
<script type="text/javascript">
//<![CDATA[
document.getElementById('WebCustomControl1_1').focus();//]]>
</script>
...
</html>

The focus does not go to the textbox.

Can anyone help with this? I'm working through a textbook example (Wrox C# Pro Ch.23) and there's nothing on the erratum page. If anyone has some of their own examples they'd like to share, that would be appreciated.

philip_cole · February 21st, 2009, 08:22 PM

I dont know the book so I don't know what the full code is meant to do, but looking at the code snippet, you have named both the containing span and the textbox WebCustomControl1_1, so when you call getElementById, it will find the span first and the focus() won't have any effect. Just try changing the id of the span.
You've also got id="WebCustomControl1_1" twice in the textbox. This won't break it, but shouldn't really be done.

Hope this helps
Phil

barkerl · February 22nd, 2009, 01:44 PM

Philip, thanks for your reply.

I removed the <span> tag and it cured the problem. The code was auto generated and I never wanted the span tag to appear anyway.

It turns out to be related to the System.Web.UI.HtmlTextWriterTag that automatically sends out this tag unless you override it.

http://msdn.microsoft.com/en-us/libr...ox.tagkey.aspx