Javascript Error in AjaxControlToolkit

thC1BL12ENDocumentation for this is sketchy at best, but I am unsure if this is the solution for all instances of the error.  The AjaxControlToolkit, is a nice addition to the ASP.NET stable, managed on Codeplex this enables you to include extenders that provide useful and sometimes just nice features to the existing toolkit of server side controls in ASP.NET.

Following their examples, I wanted to include a simple Password Strength extender to a password box.  Sounds simple, since as users type in their password it gives and indication of how good their password is.  This is merely a visual indicator and not anything to do with validation or what is acceptable.

I follow their coding example, which is below.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Control Toolkit</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="asm" runat="server" />
<div>
<asp:TextBox ID="Password" runat="server" />
<ajaxToolkit:PasswordStrength ID="ps1" runat="server" 
	TargetControlID="Password" RequiresUpperAndLowerCaseCharacters="true" 
	MinimumNumericCharacters="1" MinimumSymbolCharacters="1" 
	PreferredPasswordLength="8" DisplayPosition="RightSide" 
	StrengthIndicatorType="Text" />
</div>
</form>
</body>
</html>

Straight from the horses mouth so to speak.  But you run this and you get a nice little error jumping out at you.  This isn’t an ASP.NET one but a JavaScript error so it only appears when you visit the page with the control on it.

image

What?  What does this mean? 

0x800a138f – JavaScript runtime error: Unable to get property ‘UI’; of undefined or null reference.

Hitting break shows me this line of JavaScript; (I added comments to prevent any browser issues.

//$create(Sys.Extended.UI.PasswordStrengthExtenderBehavior, 
    {"CalculationWeightings":"40;15;15;30",
    "MinimumNumericCharacters":1,
    "MinimumSymbolCharacters":1,
    "PreferredPasswordLength":8,
    "RequiresUpperAndLowerCaseCharacters":true,
    "StrengthStyles":"Bad;Poor;Weak;Normal;Good;Excellent;Strong",
    "TextStrengthDescriptionStyles":"Bad;Poor;Weak;Normal;Good;Excellent;Strong",
    "TextStrengthDescriptions":"Bad;Poor;Weak;Normal;Good;Excellent;Strong",
    "id":"PasswordStrength1"}, 
    null, 
    null, 
    $get("txtPassword"));

Strangely looking into the data finds that Sys is fine but it is the Extended that is undefined.  So why is this happening?  Don’t know, following the exact sample there causes an error.  My opinion, the example doesn’t work, period OR, it is not meant for the version of .NET I am using (which is 3.5 SP1).

BUT I fixed it.  HOW?  Simple, maybe.

Change;

<asp:ScriptManager ID="asm" runat="server"/>

to;

<asp:ToolkitScriptManager ID="asm" runat="server"/>

I am unable to properly determine why but it seems the standard one that ships with asp, this is the plain ScriptManager doesn’t have all the elements required for the one that ships with the Toolkit.  Therefore the ToolkitScriptManager is required.  There is also a reference to the ToolkitScriptManager on their site but examples use the ASP.NET one. 

SO, to put it as simple as possible ANY of the Toolkit objects you may want to use, USE the ToolkitScriptManager, place this just under the form and it should work.  Other Ajax controls that ship with ASP.NET the normal ScriptManager will work fine.

So even if you see this error on other controls you have used check the ScriptManage component in your code.  It might be the wrong one.  Might I say, since I am unsure if one might work in specific examples, all I know is the PasswordStrength one, this fixed it.

Advertisements

Posted on February 27, 2014, in Development, Tips and Tricks and tagged , , , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: