SiteKickr Web Development

nicEdit tips – bbcode & xhtml

If you're looking for a lightweight, configurable rich text editor, nicEdit will do you proud. It's very easy to customize, relatively unobtrusive (compared to other rich text editors) and tries to produce standard's compliant XHTML (with additional plugin).

Where it falls short in my book:

I've seen this far too many times, where a developer produces a fantastic product, then offers a "Documentation Wiki", instead of any real technical documentation. Don't get me wrong, the Wiki is a great idea to promote community involvement in the documentation, but in many times it feels that the community is doing most of the documentation!

Without further complaint, let me share two things I learned about nicEdit through my own digging and trial/error.

BBCode

The ability to markup style using BBCode is what brought me to nicEdit in the first place. Perhaps I should have just guessed this, but it took a little digging to find out that the bbCode option is required to activate it.

new nicEditor({
    bbCode: true
}).panelInstance('myTextArea');

Markup (and some text) lost after form validation fails

nicEditor was working great for us, until we threw in some form validation. We were surprised to find that much of the markup and text was missing when we attempted to reinstantiate a new nicEditor instance on a textarea after server-side validation failed. After exhausting a number of options, we found that the xhtml option was the missing link.

new nicEditor({
    xhtml: true
}).panelInstance('myTextArea');

I was lead to believe by the documentation, that this option simply activated an experimental plugin used to attempt to produce XHTML standard's compliant markup. But, it seems that it's required for the plugin to work at all on a textarea with existing HTML content (such as would be the case after failed form validation).