HTML Chunks

[Matthew]

I would like to have the functionality to programmatically insert (presumably HTML) chunks that are deleted entirely if any part of them are deleted. I've found this thread that also asks for the same functionality, but it asks for two pieces of functionality after which the user posted a solution to the other piece of functionality and the thread ends. How can I do this?

[Marin Bratanov]

Hi Matthew,

RadEditor is a tool for editing the available HTML content and such features are not supported in it, it is not designed to disallow editing of certain content.

What I can suggest as a possible path for implementing such a feature is the following:
http://www.telerik.com/help/aspnet-ajax/editor-editable-and-noneditable-areas-in-editor.html - a browser feature that we cannot influence yet it can disable editing to an extent
http://www.telerik.com/community/code-library/aspnet-ajax/editor/detecting-changes-to-the-radeditor.aspx - an idea posted by a client of ours that can be used to follow changes in the content in order to modify it further (e.g. once some of the desired content starts being deleted - delete all of it with your own code)

You can also consider adding the uneditable content later with your own code, when the form is submitted, if possible for your scenario (e.g. adding a banner at the end of a message).

Regards,
Marin Bratanov
Telerik

[Matthew]

Thanks Marin! That second link is the direction I want to go; however, I'm having trouble implementing a solution. I need to work with some of your client side objects--I'm seeing Selection and Range objects--but I can't find an API for them, and my browser developer tools are only so revealing. Could you point me in the right direction? Thanks.

[Marin Bratanov]

Hi,

The following resources explain what the selection and ranges are:
http://www.telerik.com/help/aspnet-ajax/editor-getselection.html
http://www.telerik.com/help/aspnet-ajax/editor-getrange.html

And here is what ranges are:
http://msdn.microsoft.com/en-us/library/ie/ms535872(v=vs.85).aspx - what IE returns
https://developer.mozilla.org/en-US/docs/Web/API/range - the standard range object

Our library can help you with browser detection:
http://www.telerik.com/help/aspnet-ajax/telerik-static-client-library.html - see the $telerik.isIE flag


I hope this can help you with the implementation of such functionality. Should you manage to create it you can post it in the Code Library section (http://www.telerik.com/community/code-library/aspnet-ajax.aspx) and we will gladly award your efforts with Telerik points.

Regards,
Marin Bratanov
Telerik

[Matthew]

Thanks Marin, those resources are fantastic! I'd be happy to add to the Code Library. I'd like to make the solution robust, and as I'm getting into it I'm coming up with a few more questions.

1. In my own scenario, I'm inserting HTML chunks in the form of spans from the code-behind, and I've discovered that after appending it to the RadEditor's Content property it becomes a font tag. The desired appearance is preserved, and this doesn't prevent me from solving the problem, but I'd like to know what processing the content goes through.
2. Do the client-side methods perform the same processing?

I just want to be sure I know what I'm dealing with. Thanks again Marin.

[Dobromir]

Hello Matthew,

RadEditor has a set of content filters that modify the content in various ways. You can find more detailed information on the subject in the following help article and live demo:
http://www.telerik.com/help/aspnet-ajax/editor-content-filters.html
http://demos.telerik.com/aspnet-ajax/editor/examples/builtincontentfilters/defaultcs.aspx

Regarding the <span> to <font> conversion, this modification is applied to the content when editor is DesignMode because the browser's commands used by RadEditor utilize <font> tags and does not recognize <span> tags correctly.

As to the client-side API, the get_html() client-side method of the editor can provide the original content (thats not being processed by the content filters) when the provided parameter is False and converted content when the parameter is True (see this article for reference).

In addition, since RadEditor is built on top of the browser's RichTextEditing engine each browser may apply various changes to the content when added to the control, i.e. earlier versions of InternetExplorer convert all HTML tags in upper case.

Regards,
Dobromir
Telerik

[Matthew]

Thanks Dobromir. Sorry for the delayed response. Stuff happens.

It seems there's a bit of a disconnect between what the user sees and what is stored in the hidden textarea which I believe is the original content as of the last postback/callback. What is the significance of the hidden textarea? How can I keep these in sync, or do I need to?

Let me explain my setup a bit. I've set the ContentAreaMode to Div because the chunks I'm adding to the Content field are dropped in from a RadListView's server-side ItemDrop event. (An iframe, for whatever reason, doesn't let me drop things into it; maybe you guys could look into that.) On the other hand, I'm using javascript to detect deletes and selects and respectively delete or select any partially included chunks based on the filtered content.

[Marin Bratanov]

Hi Matthew,

There is a hidden textarea for the editor's internal use and then there is the HTML view, both of which need not be the same as the iframe (or div) of the actual content area in design mode. Thus, I believe you can ignore this difference.

On the subject of iframes and events - iframes create a separate context and thus events from the iframe are not available in the main page and vice versa.


Regards,
Marin Bratanov
Telerik