Learn More





DNN Community Blog

The Community Blog is a personal opinion of community members and by no means the official standpoint of DNN Corp or DNN Platform. This is a place to express personal thoughts about DNNPlatform, the community and its ecosystem. Do you have useful information that you would like to share with the DNN Community in a featured article or blog? If so, please contact .

The use of the Community Blog is covered by our Community Blog Guidelines - please read before commenting or posting.

Creating A DotNetNuke Module using the ASP.NET AJAX Control Toolkit

This tutorial will build a sample module that implements the Popup Control Extender from the Microsoft ASP.NET AJAX Control toolkit. The extender will be used to display a list of names in a drop-down when the user clicks on the text box. The user will be able to type a name in the text box or select a name from the drop-down list.

Install The AJAX Control Toolkit

Download the AJAX Control Toolkit from 

The .zip file that you download will contain a number of files.

Unzip the file AjaxControlToolkit.dll and place it in the "/bin" directory of your DotNetNuke web site.

Add the AJAX Toolkit controls to the Visual Studio Toolbox

In Visual Studio (or Visual Web Developer Express), right-click on the toolbox and select Add Tab.

Give the Tab a name

Expand the tab that was just created and right-click on the section and select Choose Items.

Use the Browse button to browse to AjaxControlToolkit.dll (in the /bin folder of your DotNetNuke installation) and click the OK button.

The AJAX Toolkit controls will now appear in your toolbox:

Enter the Code

Create a DotNetNuke User Control  (See the tutorial Creating a  Super-Simple DotNetNuke module for information on how to create a DotNetNuke User Control).

Open the source view of the .aspx page of your User Control and enter this code:

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="AJAXControlToolkit.ascx.vb" 
Inherits="DotNetNuke.Modules.AJAXControlToolkit.AJAXControlToolkit" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<br />
        <td nowrap="noWrap" valign="top">
            <strong>Enter User:</strong>
            <asp:TextBox ID="MessageTextBox" runat="server" Width="200" autocomplete="off" />&nbsp;
            <asp:Button ID="btnUser" runat="server" Text="Select User" /></td>
        <td nowrap="noWrap" valign="top">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <strong>&nbsp; Selected:</strong>
                    <asp:Label ID="lblSelectedUser" runat="server"></asp:Label>
                    <asp:AsyncPostBackTrigger ControlID="btnUser" EventName="Click" />
<br />
&nbsp;<br />
<asp:Panel ID="Panel2" runat="server">
        <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                <asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="true" 
                    Style="border: 1px outset white; width: 200px" BackColor="white">
                    <asp:ListItem Text="Shaun Walker" />
                    <asp:ListItem Text="Joe Brinkman" />
                    <asp:ListItem Text="Nik Kalyani" />
                    <asp:ListItem Text="Scott Willhite" />
                    <asp:ListItem Text="Cancel" Value="" />
<ajaxToolkit:PopupControlExtender ID="PopupControlExtender2" runat="server" TargetControlID="MessageTextBox"
    PopupControlID="Panel2" CommitProperty="value" Position="Bottom" CommitScript="e.value;" />


Switch to design view of the .aspx User Control and the display will resemble this:

in the code behind of your User Control enter this code:

Imports DotNetNuke
Imports System.Collections.Generic
Namespace DotNetNuke.Modules.AJAXControlToolkit
    Partial Class AJAXControlToolkit
        Inherits DotNetNuke.Entities.Modules.PortalModuleBase
        Protected Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
                If DotNetNuke.Framework.AJAX.IsInstalled Then
                End If
            Catch exc As Exception        'Module failed to load
                ProcessModuleLoadException(Me, exc)
            End Try
        End Sub
        Protected Sub RadioButtonList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)
            If Not String.IsNullOrEmpty(RadioButtonList1.SelectedValue) Then
                ' Popup result is the selected task
                ' Cancel the popup
            End If
            ' Reset the selected item
        End Sub
        Protected Sub btnUser_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnUser.Click
            lblSelectedUser.Text = MessageTextBox.Text
        End Sub
    End Class
End Namespace


Save the User Control and place an instance of it on a page in your DotNetNuke site (see the tutorial Creating a  Super-Simple DotNetNuke module for information on how to configure a DotNetNuke User Control and place an instance of it on a page in your DotNetNuke Site). You can download the complete module from here:

A Few Things To Note

This example module does not use the Supports Partial Rendering setting in the configuration for the User Control that would normally wrap the entire control in an Update Panel. Instead it uses this code:

If DotNetNuke.Framework.AJAX.IsInstalled Then
End If


to instruct the DotNetNuke framework to insert the ScriptManager control that allows the AJAX functionality to work. Update Panels are only used to wrap the drop-down list and the Selected label.

The sample code has this dependency set,  AjaxControlToolkit.PopupControlExtender.

If the ASP.NET AJAX Control toolkit assembly is not in the /bin folder of the DotNetNuke site (or available in the Global Assembly Cache (GAC)) the module will not install and it will show an error.

Download the sample code here:


Comment Form

Only registered users may post comments.


2sic Daniel Mettler (124)
Aderson Oliveira (15)
Alec Whittington (11)
Alex Shirley (10)
Andrew Nurse (30)
Anthony Glenwright (5)
Antonio Chagoury (28)
Ash Prasad (21)
Ben Schmidt (1)
Benjamin Hermann (25)
Benoit Sarton (9)
Beth Firebaugh (12)
Bill Walker (36)
Bob Kruger (5)
Brian Dukes (2)
Brice Snow (1)
Bruce Chapman (20)
Bryan Andrews (1)
cathal connolly (55)
Charles Nurse (163)
Chris Hammond (203)
Chris Paterra (55)
Clinton Patterson (28)
Cuong Dang (21)
Daniel Bartholomew (2)
Dave Buckner (2)
David Poindexter (3)
David Rodriguez (2)
Doug Howell (11)
Erik van Ballegoij (30)
Ernst Peter Tamminga (74)
Geoff Barlow (6)
Gifford Watkins (3)
Gilles Le Pigocher (3)
Ian Robinson (7)
Israel Martinez (17)
Jan Blomquist (2)
Jan Jonas (3)
Jaspreet Bhatia (1)
Jenni Merrifield (6)
Joe Brinkman (269)
John Mitchell (1)
Jon Henning (14)
Jonathan Sheely (4)
Jordan Coopersmith (1)
Joseph Craig (2)
Kan Ma (1)
Keivan Beigi (3)
Ken Grierson (10)
Kevin Schreiner (6)
Leigh Pointer (31)
Lorraine Young (60)
Malik Khan (1)
Matthias Schlomann (15)
Mauricio Márquez (5)
Michael Doxsey (7)
Michael Tobisch (3)
Michael Washington (202)
Mike Horton (19)
Mitchel Sellers (28)
Nathan Rover (3)
Navin V Nagiah (14)
Néstor Sánchez (31)
Nik Kalyani (14)
Peter Donker (52)
Philip Beadle (135)
Philipp Becker (4)
Richard Dumas (22)
Robert J Collins (5)
Roger Selwyn (8)
Ruben Lopez (1)
Ryan Martinez (1)
Salar Golestanian (4)
Sanjay Mehrotra (9)
Scott McCulloch (1)
Scott S (11)
Scott Wilkinson (3)
Scott Willhite (97)
Sebastian Leupold (80)
Shaun Walker (237)
Shawn Mehaffie (17)
Stefan Cullmann (12)
Stefan Kamphuis (12)
Steve Fabian (31)
Timo Breumelhof (24)
Tony Henrich (3)
Torsten Weggen (2)
Vicenç Masanas (27)
Vincent Nguyen (3)
Vitaly Kozadayev (6)
Will Morgenweck (37)
Will Strohl (163)
William Severance (5)
Try Evoq
For Free
Start Free Trial
a Demo
See Evoq Live
Need More Information?