[SOLVED] Html rich text editor and read-only content?

Html rich text editor and read-only content?

I'm looking for a way to make specific elements in a HTML rich text editor read-only and not possible to modify by the user. Is there any way to achieve this behavior?

An example of the rich text editor I'm refering to would be this code snippet:

 <html>
 <head>
  <script type="text/javascript">
   var Editor = {
    Init: function() {
     $("#editor").get()[0].contentWindow.document.designMode = "on";
    }
   }

   $(document).ready(function() { Editor.Init(); });
  </script>
 </head>
 <body>
  <iframe id="editor" style="width: 500px; height: 250px;"></iframe>
 </body>
</html>

/Tobias

Solution

I don't know whether this helps you, but WYSIWYG editor CKEditor can protect content using a regular expression:

http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.protectedSource

CKEDITOR.config.protectedSource Since: 3.0 List of regular expressions to be executed over the input HTML, indicating code that must stay untouched.

config.protectedSource.push( /<\?[\s\S]*?\?>/g );   // PHP Code
config.protectedSource.push( /<%[\s\S]*?%>/g );   // ASP Code
config.protectedSource.push( /(]+>[\s|\S]*?<\/asp:[^\>]+>)|(]+\/>)/gi );   // ASP.Net Code

I have not used it myself yet, but from what I hear in forums and here on SO, it seems to work quite decently.

I have used CKEditor, though, and can recommend it as one of the very best WYSIWYG editors available, even if documentation and community support are a bit sparse, it still being very new on the market.