Adding ASP.NET controls via the editor

[Suddy]

Hi,

I have written some code that will parse a string and render any ASP.NET controls within it (using Page.ParseControl). This is working nicely and I am able to use RadEditor in source mode to edit the strings such as this:

Hello World, here is a button: <asp:button id="btnTest" runat="server"></asp:button>

When I switch to design or preview mode though, I don't see anything. This is as expected but I would like to customise RadEditor so that a snippet of HTML is displayed to let the user know it is still there. Is this possible? I was thinking about a filter but as far as I understand it these permanently clean up the source, whereas I want to change what is shown depending on the view whilst preserving the source.

I would also ideally like to do is add ASP.NET control declarations via the UI. I think the right way to do this is probably to use a custom dialog, is that a good starting point?

Thanks in advance for any help and advice,

Richard.

[Rumen]

Hi Suddy,

RadEditor is a client-side browser tool, providing the ability to visually edit pure HTML text using the underlying Rich Text Editing engine of the browser. This browser engine supports only standard HTML/XHTML tags and plain text.

Please, note that if you put a server tag in RadEditor the editor will not strip the tag, but will not render it in Design mode.

The ASP and ASP.NET server tags are not HTML tags and the browser is not able to visualize them. The browser cannot visualize XML Tags and when you put <asp:button> in the editor, the server-side framework will not parse the content (as it is part of the editor, not part of the page).
So, instead of sending to the client the HTML tag <input type=button> it will send <asp:button> - which means nothing to the browser.

To understand the situation better, please create a new HTML page with extension .html and add your server tags content you put to the browser and load it in the browser.

RadEditor is more similar to a desktop HTML editor rather than to an integrated program like MS Word, FrontPage or Visual Studio for web and your scenario is not supported.

What you can do is to render the asp.net tag border using inline style or css class, e.g.

<asp:button id="btnTest" style="border: 1px solid red; width: 100px;" runat="server">button</asp:button>

Greetings,
Rumen
the Telerik team

[Suddy]

Thanks for replying. I understand that RadEditor is just a HTML editor so an ASP.NET (on any other non-HTML mark-up) won't be shown. What I would like to do is show something else instead as a place holder when viewing in design mode.

For example, with the following in source view:

Hello World, here is a button: <asp:button id="btnTest" runat="server"></asp:button>

In design view I would like to see something like:

Hello Word, here is a button [Button Control, switch to source to edit]

Does that make sense? I am not sure if I am explaining myself very well.

[Rumen]

Hi Suddy,

What you can do is to define your own custom tags that you can later replace on the server with the respective server tags using the server String.Replace() method. Please, note that the custom tags should has a namespace, e.g.

<my:placeholder name="Button" style="border: 1px solid red; width: 100px;">Button Control</my:placeholder>

In IE it is recommended to set namespaces for the custom tags: Using Custom Tags in Internet Explorer.


As to your approach to has such content [Button Control, switch to source to edit] and replace it with asp:tag when switching to HTML mode, you can implement a custom content filter that will search for such content and replace it in HTML mode.

Sincerely yours,
Rumen
the Telerik team