Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / Ajax

Adding AJAX HTMLEditorExtender Control to a Webform

5.00/5 (2 votes)
17 Oct 2014CPOL 24.4K  
Adding AJAX HTMLEditorExtender control to a webform

Here are the steps to add an Ajax HMTLEditorExtender control in webform.

  1. In VS 2013, open Tools > Library Package Manager > Package Manager Console.
  2. Enter command:
    PM> Install-Package AjaxControlToolkit
    This will download and add AjaxControlToolkit.dll reference with your website.
  3. Add the following tags in web.config:
    XML
    <configSections>
        <sectionGroup name="system.web">
          <section name="sanitizer" requirePermission="false" 
                   type="AjaxControlToolkit.Sanitizer.ProviderSanitizerSection, AjaxControlToolkit" />
        </sectionGroup>
      </configSections>
    
      <sanitizer defaultProvider="HtmlAgilityPackSanitizerProvider">
          <providers>
            <add name="HtmlAgilityPackSanitizerProvider" 
                 type="AjaxControlToolkit.Sanitizer.HtmlAgilityPackSanitizerProvider"></add>
          </providers>
        </sanitizer>

    <configSections> should be the first child tag of <configuration> and <sanitizer> should be a child of <system.web> tag. Don’t worry about warning at sanitizer tag. It will work fine.

  4. In Site.Master, replace:
    ASP.NET
    <asp:ScriptManager id ="ScriptManager1"runat="server">
    

    with:

    ASP.NET
    <ajaxToolkit:ToolkitScriptManager ID="ajxToolKit" runat ="server">
    

    This should be added inside form tag. Remove:

    ASP.NET
    <asp:ScriptReference Name="MsAjaxBundle" /> 

    from script references.

  5. Now you can add Ajax HTMLEditorExtender on webpage.
  6. Here is a sample source of sample content page to add Ajax HTMLEditorExtender.
    ASP.NET
    <asp:TextBox ID="txtCategory"
    TextMode="MultiLine" Columns="60" Rows="10"
          runat="server" />
    
    <ajaxToolkit:HtmlEditorExtender ID="HTMLEditor1" TargetControlID="txtCategory"
          runat="server" />
    

    Image 1

In case the HTMLEditorExtender is working fine on local machine and after deployment on server, ReflectionTypeLoadException occurs, then check the trust level. Ajax Tookit requires full trust level to work. Default trust level on server is medium. So, to make ajax toolkit work, change the trust level on server to full.

This is can be done by adding the following line under <system.web> section of web.config:

XML
<trust level="Full" /> 

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)