Integrating MarkItUp rich text editor preview with ASP.NET MVC app

Question

I'm testing out the MarkItUp! rich text editor in a MVC app, and everything is working great with the exception of the preview. In the settings (set.js), there is a previewParserPath property ("path to your BBCode parser"). I'm not exactly sure what this is looking for in terms of proper integration with the MVC app.

I believe that this property is what allows the rendering of the text to appear as HTML rather than [code][/code] etc.

In my controller, I have created the following:

[AcceptVerbs(HttpVerbs.Get)]
[ValidateInput(false)]
public String ParseCode(string toBeParsed)
{
    return BBCode.ToHtml(toBeParsed);
}

Pentheas

Have you tried setting the previewParserPath to /ControllerName/ParseCode? – Calorifacient

No I haven't. I'll give it a shot. – Pentheas

Answer 1

Looking at the MarkItUp documentation

previewParserPath string > path You can set path of your own parser to preview the result of markup langages other than html. If this property is setted, built-in preview will be overrided by your own preview script. Use ~/ for markItUp! root.

previewParserVar string > default: data Name of the var posted with the editor content to the parser defined above.

So I assume you set previewParserPath to /MyController/ParseCode where MyController is the controller with your parsing action. Also, set previewParserVar to toBeParsed

Note: I'm not sure if MarkItUp does an POST or GET to the parser, so I would remove the AcceptVerb[HttpVerbs.Get] from your action. I would assume it uses POST though.

Calorifacient

Sweet! I corrected the previewParserPath to use the "/" instead of "\" above! – Pentheas

Answer 2

I faced this problem recently and decided just to override the preview button click with a jQuery handler that grabs the preview html via AJAX from my own WebMethod and writes the resulting HTML into a jQuery UI Dialog.

Bainbrudge