TinyMCE inline mode showing raw HTML rather than formatted output

Question

I'm attempting to use the inline mode of TinyMCE with an MVC 5 page. I created the HTML content using a TinyMCE editor in the standard mode as follows:

That data is saved back to the database and then retrieved and displayed on a different page. On that page I've set up an instance of TinyMCE to display that content in the inline view as follows:

  <div id="myeditablediv">@Model.LongDescription</div>

  <script src="~/scripts/tinymce/tinymce.min.js"></script>

  <script type="text/javascript">
    tinymce.init({
      selector: '#myeditablediv',
      entity_encoding: 'raw',

      inline: true
    });
  </script>

I'd expected that to show the formatted HTML in a clickable TinyMCE control with no toolbars, but instead it's just showing the raw HTML:

Clicking on the control does switch it into edit mode and the toolbar appears etc:

so it looks like I'm not passing the data to be rendered to the control correctly when setting up the div with <div id="myeditablediv">@Model.LongDescription</div>?

Michael Fromin Michael Fromin · Accepted Answer · 2017-12-08T15:05:00

I am guessing that your code is escaping the HTML when inserting it back into the page. I don't know ASP.NET but there is likely something you can do to @Model.LongDescription to have it place the raw HTML into the page.

A quick google search suggest this might be the answer:

@Html.Raw(@Model.LongDescription)

TinyMCE inline mode showing raw HTML rather than formatted output

1 Answers