Javascript Rich Display Component/Methodology

Posted by Laramie on Stack Overflow See other posts from Stack Overflow or by Laramie
Published on 2010-06-01T04:50:41Z Indexed on 2010/06/01 4:53 UTC
Read the original article Hit count: 283

quick back story--

I am working on ASP.Net based template editor that lets authors create text templates using Javascript inserted placeholder tags that will be filled in with dynamic text when the templates are used to display the final results.

For example the author might create a template like

The word [%12#add] was generated dynamically.

The application would eventually replace the tag with a dynamic word down the road (though it's not specifically relevant to this post)

The word foo was generated dynmamically.

Depending on the circumstances, the template may be created in a text input, textarea or a modified version of the Ajax Control Toolkit HTML Editor. There might be 40 or more of these editable elements on the page, so using lots of stripped down or modified HTML editors would probably bog the page down too much.

The problem is that the tags such as [%12#add] are displayed inline with the user text and the result is confusing and aesthetically gross. The goal is parse the contens of the source element and when a tags such as [%12#add] are encountered, display something prettier and less cryptic to the user such as a stylable element or image wherever tags such as [%12#add] occur. The application still needs the template text with the tags on postback.

So the user might see

The word tag placeholder was generated dynamically.

but the original template would still be the value of the text input box

The word [%12#add] was generated dynamically.

It seems HTML editors like the ACT version and FckEditor accomplish this by rendering their output in an IFrame, but rather than kill myself trying to roll a lighter specialized version myself, I thought I'd ask if anyone knows of an existing free component or approach that has already tackled this.

With good reason, I don't think S.O. allows HTML formatting, but the bold "tag placeholder" above would ideally be something like tag placeholder.

© Stack Overflow or respective owner

Related posts about ASP.NET

Related posts about JavaScript