jQuery: Validate FCKEditor using jQuery
I’ve written a quick jQuery plugin which allows you to validate an FCKEditor instancing using jQuery. This plugin will both validate FCKEditor instances both on-the-fly (as you type), and when you attempt to submit a form.
2. Implement the plugin:
-
$(document).ready(function() {
-
if(typeof jQuery.fn.fckEditorValidate == ‘function’) {
-
jQuery.fn.fckEditorValidate({instanceName: ‘content’});
-
}
-
});
The full list of arguments which may appear in the brackets are:
-
instanceName: The name of the FCKEditor instance (default: ‘content’),
-
preventFormSubmit: Prevent form from submitting if FCKEditor instance is empty (default: true),
-
showValidationError: Show a message if the FCKEditor instance is empty (default: true),
-
showValidationErrorBeforeFCKEditor: Show the message before the FCKEditor on the page (default: false – i.e. shows message below FCKEditor),
-
validationErrorClass: CSS class to attribute to label showing validation error message (default: ‘fckValidateError’),
-
validationErrorMessage: Message to show when FCKEditor instance is empty (default: ‘Please complete this field’)
This is by no means an exhaustive or complete solution; you should always implement some server-side validation. Javascript cannot be solely relied upon, as users may not have it in their web browser, or may choose to disable it. There’s also some known issues with IE with the on-the-fly (as you type) validation being a bit hit and miss.
When the form is submitted, this plugin will kick in and has been tested on IE6, 7, Firefox 3 and Safari 3.
Comment #1
You need to replace the single quotes in your code sample above–the ones there are smart quotes, so a straight cut and paste doesn’t work. I have managed to get the plugin to ‘work’ in that it won’t let me submit an empty fckeditor instance, but it’s not showing any error message. Any ideas?