AJAX UpdatePanel stops custom JavaScript working

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Andrew Jocelyn - 11 Mar 2008 19:38 GMT

Hi

I have a custom server control which basically adds a client side character
counter to display with an Html TextArea. When I use the control inside an
UpdatePanel the JavaScript counter disappears.

Please see code below.

Any ideas?
Thanks
Andrew

protected override void OnPreRender(EventArgs e)
{
if (IsRequired)
_reqValidator.Visible = true;

// Get a ClientScriptManager reference from the Page class.
ClientScriptManager cs = Page.ClientScript;

cs.RegisterClientScriptInclude("DisplayLengthFunctions",
cs.GetWebResourceUrl(this.GetType(),
"MyControls.WebControls.DisplayLengthFunctions.js"));

cs.RegisterStartupScript(this.GetType(), this.ID + "DisplayLength",
"DisplayCounter('" + _textBox.ClientID + "','" + this.ID + "_Counter'," +
this.MaxLength.ToString() + ");", true);

base.OnPreRender(e);
}

///////////////////////////////
// DisplayLengthFunctions.js
////////////////////////////////
function DisplayCounter(textId, counterId, maxLength) {
var W3CDOM = document.createElement && document.getElementsByTagName &&
document.getElementById;
if (!W3CDOM) return;

var x = document.getElementById(textId);
x.setAttribute('maxlength', maxLength);

var counter = document.getElementById(counterId);
counter.innerHTML = '<span>0</span>/' + maxLength;
counter.relatedElement = x;

x.relatedElement = counter.getElementsByTagName('span')[0];

x.onkeyup = x.onchange = CheckMaxLength;
x.onkeyup();
}

// event handler for textarea onkeyup and onchange
function CheckMaxLength() {
var maxLength = this.getAttribute('maxlength');
var currentLength = this.value.length;
if (currentLength > maxLength)
this.relatedElement.style.color = 'red';
else
this.relatedElement.style.color = '';
this.relatedElement.firstChild.nodeValue = currentLength;
}

Reply to this Message

andrew.douglas11@gmail.com - 11 Mar 2008 19:55 GMT

In your PreRender event code, try ScriptManager.RegisterClientScript
instead of ClientScriptManager.whatever

Cheers,
Andy

Reply to this Message

Steven Cheng - 12 Mar 2008 05:13 GMT

Hi Andrew,

As Andy suggested, you may try using the AJAX ScriptManager class's
RegisterSclient.... methods instead of the ASP.NET
Page.ClientScriptManager... Here are some articles about dealing with
scripts of controls used in AJAX updatepanel:

#Inline Script inside an ASP.NET AJAX UpdatePanel
http://weblogs.asp.net/infinitiesloop/archive/2007/09/17/inline-script-insid
e-an-asp-net-ajax-updatepanel.aspx

#HOWTO: Write controls compatible with UpdatePanel without linking to the
ASP.NET AJAX DLL
http://weblogs.asp.net/leftslipper/archive/2006/11/13/HOWTO_3A00_-Write-cont
rols-compatible-with-UpdatePanel-without-linking-to-the-ASP.NET-AJAX-DLL.asp
x

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead

Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we

can improve the support we provide to you. Please feel free to let my
manager know what you think of

the level of service provided. You can send feedback directly to my manager
at: msdnmg@microsoft.com.

==================================================
Get notification to my posts through email? Please refer to

http://msdn.microsoft.com/subscriptions/managednewsgroups/default.aspx#notif
ications.

Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response

from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take

approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution.

The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump

analysis issues. Issues of this nature are best handled working with a
dedicated Microsoft Support

Engineer by contacting Microsoft Customer Support Services (CSS) at

http://msdn.microsoft.com/subscriptions/support/default.aspx.
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.

--------------------

>From: "Andrew Jocelyn" <j055@newsgroups.nospam>
>Subject: AJAX UpdatePanel stops custom JavaScript working
>Date: Tue, 11 Mar 2008 18:38:54 -0000
>Lines: 66

>Hi
>
[quoted text clipped - 58 lines]
> this.relatedElement.firstChild.nodeValue = currentLength;
>}

Reply to this Message

Rate this thread:

AJAX UpdatePanel stops custom JavaScript working

Free Magazines