PC Review


Reply
Thread Tools Rating: Thread Rating: 1 votes, 1.00 average.

AJAX UpdatePanel stops custom JavaScript working

 
 
Andrew Jocelyn
Guest
Posts: n/a
 
      11th Mar 2008

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 With Quote
 
 
 
 
andrew.douglas11@gmail.com
Guest
Posts: n/a
 
      11th Mar 2008
In your PreRender event code, try ScriptManager.RegisterClientScript
instead of ClientScriptManager.whatever

Cheers,
Andy
 
Reply With Quote
 
Steven Cheng
Guest
Posts: n/a
 
      12th Mar 2008
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/infinitiesloo...e-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/a...00_-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: (E-Mail Removed).

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

http://msdn.microsoft.com/subscripti...ult.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/subscripti...t/default.aspx.
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.

--------------------
>From: "Andrew Jocelyn" <(E-Mail Removed)>
>Subject: AJAX UpdatePanel stops custom JavaScript working
>Date: Tue, 11 Mar 2008 18:38:54 -0000
>Lines: 66


>
>
>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 With Quote
 
 
 
Reply

Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
progress indicator initial page load ajax not working use javascript? CMELLO@tams.com Microsoft Dot NET 0 8th Jul 2009 08:46 PM
AJAX Problem. JavaScript not working if i push it to Updatepanel's content. Arachnid Microsoft Dot NET Framework 1 5th Oct 2007 12:02 PM
AJAX.NET ; Dynalically pushed JavaScript to Updatepanel's content not executing Arachnid Microsoft Dot NET 0 5th Oct 2007 10:22 AM
ASP.NET AJAX : Dynamically Pushed JavaScript not working after being pushed to UpdatePanel's content Arachnid Microsoft ASP .NET 0 5th Oct 2007 10:17 AM
AJAX : Dynamlically pushed JavaScript not working after Update Panel is updated Arachnid Microsoft Excel Programming 0 5th Oct 2007 10:15 AM


Features
 

Advertising
 

Newsgroups
 


All times are GMT +1. The time now is 06:03 AM.