New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Adding the Telerik Controls to Your Project

This article describes how to add the Telerik® UI for ASP.NET AJAX controls to an existing ASP.NET web application or website and lists the required prerequisites.

If you are looking for a complete step-by-step guide on creating a new web application with Telerik controls, see the First Steps article.

Prerequisites

Before adding a Telerik control to your project, verify that the server, development machine, and the web application or website satisfy the following requirements:

  1. Make sure you have installed ASP.NET AJAX, which comes with .NET 3.5+ installations.

  2. If your web application is not using ASP.NET AJAX, configure it to do so. For detailed instructions, see Adding ASP.NET AJAX Features to an Existing Web Application.

  3. Add the needed HTTP handlers in web.config as described in the web.config Settings Overview article.

    To configure your project by adding the needed assemblies, the required references, and web.config settings to the solution, you can use the Convert to Telerik Web Application option in the Telerik Visual Studio Extensions. Alternatively, you can log into Your Telerik.com account and obtain the Telerik.Web.UI.dll and other desired assemblies from the Telerik_UI_for_ASP.NET_AJAX_20xx_x_xxx_Dev_hotfix.zip file.

  4. Add a ScriptManager control at the top of the page in which you are going to add a Telerik control.

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

    If the page is a content page or user control, you can add the ScriptManager to the master or main page. For more details about ScriptManager, see Microsoft's dedicated article.

    Alternatively, you can use RadScriptManager, which extends the standard ScriptManager control and adds more features to it.

Adding Telerik Controls to a WebForm

To add a Telerik control to an ASP.NET WebForm, you can use either of the following approaches:

Dragging a Telerik Control from the Toolbox

The easiest way to add a Telerik Control is by dragging it from the Visual Studio .NET Toolbox in Design mode. Visual Studio will automatically copy the Telerik.Web.UI.dll to the bin folder of your web application and will create the respective references.

If the Telerik controls aren't in the toolbox, see Adding the Telerik Controls to the Visual Studio Toolbox.

Manually Adding a Telerik Control to the Form

You can add any Telerik Control manually to the page by following the instructions below:

  1. Copy the Telerik.Web.UI.dll assembly from the binXX folder of the Telerik® UI for ASP.NET AJAX installation to the bin folder of your web application (where XX specifies the version of the .NET framework supported by the assembly), and then reference it. To learn more about the assemblies in the various Telerik UI installation packages, see Included Assemblies.

  2. Open your aspx or ascx file and add the Telerik® UI for ASP.NET AJAX Register directive at the top so that Visual Studio recognizes the Telerik control tags:

    
        <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
    ````
    

    If multiple pages in your application will use Telerik controls, add the following lines to the web.config file so you don't need to add the Register directive to every page or user control.

    
        <pages>
         <controls>
           <add tagPrefix="telerik" namespace="Telerik.Web.UI" assembly="Telerik.Web.UI" />
         </controls>
        </pages>   
    ````
    
  3. In the body of the Web Form, add the tags of the desired Telerik controls:

            <form id="form1" runat="server">
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
            <telerik:RadTextBox RenderMode="Lightweight" ID="RadTextBox1" Text="Some Text" runat="server" /> 
            <telerik:RadPushButton RenderMode="Lightweight" ID="RadButton1" runat="server" Text="Submit"></telerik:RadPushButton>
        </form>
    ````
    

    Always place the Telerik AJAX controls after the ScriptManager declaration and inside the <form> tag. Make sure that the RenderMode property of the controls is set to Lightweight.

    Configuring Controls

    After you've added the needed controls, you can configure them by using the following approaches:

    • Use the built-in properties from the markup or the code-behind.

    • Use the inner tags of the control.

    • Use the configuration wizard in the Visual Studio Designer.

    You can read more about the individual controls' properties and features in their respective sections in the documentation, demos, and by using the IntelliSense in Visual Studio.

    Next Steps

    See Also

In this article
Not finding the help you need? Improve this article