HTML Editor for ASP.NET AJAX

Readme

License

Introduction

Features

Getting Started

The zip file should be extracted to a new folder. For both ASP.NET 2.0 (Visual Studio 2005) and ASP.NET 3.5 (Visual Studio 2008) configurations, it includes:

• The Winthusiasm.HtmlEditor control project
• A sample website that uses the HtmlEditor control
• A solution that contains both

System Requirements

If ASP.NET 2.0 is installed

• ASP.NET AJAX Extensions 1.0 must be installed
• Site must be ASP.NET AJAX enabled

If ASP.NET 3.5 is installed

• Site must be ASP.NET AJAX enabled

Supported Browsers

• Internet Explorer 6+
• Firefox 1.5+
• Opera 9+
• Safari 3+
• Chrome 1+

Included Folders and Files

The zip file includes separate folders for ASP.NET 2.0 and ASP.NET 3.5 configurations. Each configuration folder also contains an appropriate solution file.

Release Folder

• Winthusiasm.HtmlEditor.dll

Site Folder

• Demo.aspx
• Demo.aspx.cs
• Demo.full.aspx
• Demo.full.aspx.cs
• Web.config

Site/Emotions Folder

• Emotion image files

Site/ImageBrowser/Aspx Folder

• ImageUpload.aspx
• Web.config

Site/ImageBrowser/Images Folder

• Example folder
• Example image file

Winthusiasm.HtmlEditor Folder

• Source files for the Winthusiasm.HtmlEditor control project

Other

• License.htm
• Readme.htm
• ServerReference.chm

Using the Code

1. Double-click the solution file to open the solution in Visual Studio 2005 or Visual Studio 2008
2. Select Build/Rebuild Solution from the menu. This will build the project and copy the project DLL to the Bin folder of the sample website.
3. Set Demo.aspx as the Start Page
4. Press F5

Site Installation

Required Steps

1. Copy Winthusiasm.HtmlEditor.dll to the Bin folder of your site
2. Add a Register statement for the HtmlEditor to the top of the page
3. Add a Custom Tag for the HtmlEditor to the page

Use Model

1. Use the Text property to set the editor HTML
2. Save the HTML when appropriate
3. Use the Text property to get the "saved" HTML

Use Model Details: Saving the HTML when Appropriate

The editor's "client-side" Save method instructs the editor to store the current HTML (converting to XHTML if appropriate) and clears the modified flag. When the editor property AutoSave is set to true (the default), the client-side Save method is called automatically as part of the client-side ASP.NET validation process before the form is submitted. All controls with a CausesValidation property set to true (the default) trigger the behavior.

If the AutoSave implementation is not appropriate or sufficient, the client script to trigger the client-side Save can be attached through the optional SaveButtons property or manually.

Use Model Details: Emotions

To include the Emotions button in the toolbar perform these additional steps:

1. Copy the emotions images to a folder on the site
2. Set the EmotionsFolder property to that location (e.g. ~/Images/Emotions)
3. Modify the Emotions property if the images are not the default set
4. Include the Emotions button in the Toolbars property where appropriate

Use Model Details: Image Browser

To enable the Image Browser functionality perform these additional steps:

Required Steps

1. Create a folder for ImageUpload.aspx (e.g. ImageBrowser/Aspx)
2. Copy ImageUpload.aspx to that folder
3. Create a dedicated folder for uploaded images (e.g. ImageBrowser/Images)
4. Set the AspxDirectory property to the location of ImageUpload.aspx
5. Set the ImagesDirectory property to the dedicated folder

Recommended Steps

1. Copy the appropriate Web.config file to the ImageUpload.aspx folder
2. Modify its maxRequestLength configuration property
3. Set other Image Browser properties as appropriate

Web.config and maxRequestLength

The httpRuntime configuration property maxRequestLength determines the ASP.NET maximum size (in KB) of any page request, including uploaded file data. Requests larger than this length throw an exception on the server in ASP.NET. The Image Browser catches the maxRequestLength exception in the ImageUpload.aspx page error handler and reports the error in the Upload UI as:

"File is too large for the system to upload"

By placing a dedicated Web.config file in the ImageUpload.aspx folder, the site can specify the maximum size of any upload, albeit including other page data. See the example Web.config file in the ImageUpload.aspx folder.

Note that the maxRequestLength limit should be set in addition to the MaxUploadFileSizeInKB  Image Browser property. In most cases the maxRequestLength configuration property should be set just slightly higher than the MaxUploadFileSizeInKB.