It's finally time to introduce the DevExpress ASP.NET Rich Edit control - ASPxRichEdit. It has all the powerful editing features of great text editors like Microsoft Word, but online. And it’s beautiful, check it out here shown with the Mulberry theme:
Benefits
With the DevExpress ASP.NET RichText editor control, you can craft and edit rich-text documents with your ASP.NET sites with ease. It's WYSIWYG!
- A familiar interface like Microsoft Word for editing (with Ribbon UI)
- Cross-browser compatible (even touch mobile browsers)
- A rich user interface that's customizable
- Multiple themes support
- Document management, export, and print capabilities
- And more... (read the features section below)
Preview for 14.2
This first version of the ASPxRichEdit control is a preview version and it's available in the 14.2 release.
A preview version means that we’re not finished with the features, stability, and other goodies that we want to bake into the new ASPxRichEdit control. For example, we're planning to add support for mail merging, table and lists support, float objects, table of contents, and more. And we are already working on these features for a future major release.
Warning: You are free to use this control in your websites today. However, be aware that it is a preview version and therefore, the API, properties, and/or features may change.
That said, the new ASP.NET RichEdit control has enough of a feature set that we'd love for you to test drive it and give us your feedback.
Features
The preview version of the ASPxRichEdit control includes:
- Page settings support (margins, page size, orientation)
- Paragraph settings support (vertical and horizontal spacing, alignment, indents)
- Document styles support
- Multiple formats supported: DOCX, RTF, TXT, XML, ODT, EPUB, MHT, and DOC
- Multi-column text mode
- Different kinds of breaks (page, column, section)
- Inline images (insert, resize)
- Horizontal document ruler (similar to desktop rich-text editor)
- Clipboard support (includes inserting images from clipboard)
- Built-in document manager
- Tab stops
- Print support
- Full-screen mode
- and much more...
Design time support
The DevExpress ASP.NET RichEdit control has great design time support with custom dialogs to help you build the toolbars, customize client-side API, and more:
HTML vs Rich Editor
I'm sure you already know that DevExpress also offer the excellent ASP.NET HTML Editor control, ASPxHtmlEditor. So why did we introduce another document editor?
The ASPxHtmlEditor is a powerful control that was designed to edit HTML content.
However, you our excellent customers wanted a true rich text editor. We've listened to your feedback and decided last year to start working on this major new control, the ASPxRichEdit.
Rest assured that the ASPxHtmlEditor is still available and we have plans to improve it for future releases.
For now, use the:
- ASPxRichEdit control for editing rich text content.
- ASPxHtmlEditor control for editing HTML content.
How does it work (internal goodness)?
The new ASPxRichEdit has some intricate code that our team been working on for almost a year. Check out some of the many pieces that go into making a complex, fast, and powerful control like the ASPxRichEdit:
New JavaScript text engine
We've developed a new JavaScript text processing engine specially for the ASPxRichEdit control. And this engine controls everything in the document editing process including: model manipulations, layout calculations & presentation, selection processing, history, clipboard, input operations, and client-server model synchronization. Yes, it's a does a lot and it does it efficiently too. Take a look one of the ASPxRichEdit demos in 14.2 (coming soon).
Server & client-side in harmony
The ASPxRichEdit control has a unique server-side setup that differs from classic ASP.NET controls. The server part of ASPxRichEdit control doesn't generate the (HTML) rendering. Instead, the ASPxRichEdit interacts with the document file by reading its' content, sending JSON representation of the model to the client-side, and then applying changes from the client model to the original document.
Therefore, the Server and client objects work separately. And they communicate through JSON requests and responses via a special ASP.NET handler. So, when user changes the document on the client-side then the changes are all applied to the client model immediately. However,on the server side these changes are sent asynchronously and transparently to the end-user.
This setup results in an efficient and harmonious experience for the end-user because this communication does not have an effect on the UI performance. In fact, it helps give you a smoother experience overall.
Because the client-side object model is a big part of the ASPxRichEdit, let's take a look at it's two big parts: the layout engine and event processor.
Layout engine
The layout engine is the central piece the ASPxRichEdit's client-side object. The layout engine reads the document model and then transforms it to a layout for the end-user. The Layout engine does this by calculating each word from the model, measures its size, and places it in the layout: box after box and row after row.
Layout is very important for a rich text editor because it has to be accurate (WYSIWYG) and bad layout can effect performance. The layout engine also needs to take into account all existing settings of the document to create the correct layout. Things like: page size and margins, paragraph settings, tab stops, and section settings. This type of layout processing is not possible in standard HTML editors.
Event processor
The other side of the client control is the event processor. It controls all user actions, from text typing to mouse moving, and working with the clipboard. It captures user actions and transforms them to a set of commands. For instance, when user is moving the mouse with the left button pressed down then the event processor should determine the mouse cursor position relatively to the document model and call the SetSelection command. If mouse moving has started on a selected part of the document then it draws the dragging cursor pointer below the cursor and executes the MoveContent command when the user releases the mouse button.
As you can see, even a simple task can have a complex set of events associated with it and it's the event processor's job to read and execute them properly.
Canvas manager
The most visible part of the control is the canvas manager and its document rendering.
The canvas manager is responsible for what the end-user sees. The canvas manager essentially generates the HTML markup for layout representation, applies changes when the user interacts with the document, applies formatting commands, and is also responsible for scrolling. It also tracks all changes in the layout, determines what to show to the end-user, and finally draws the canvas (editable content of the ASPxRichEdit).
ASP.NET MVC support?
No, there is no ASP.NET MVC extension available in 14.2 release, however...
Yes, there will be an ASP.NET MVC extension when we release the final version of the ASPxRichEdit!
Available in the 14.2 release
Now that you're excited about this great new ASP.NET control, remember 2 things:
- It's a preview version (for now).
- And it's available in the 14.2 release.
What do you think about the new ASPxRichEdit control? Drop me a line below.
Free DevExpress Products - Get Your Copy Today
The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the
DevExpress Support Center at your convenience. We'll be happy to follow-up.