Geeks With Blogs
HanSolo code monkey

I have been working with CKEditor recently and ran into an issue where I noticed some strange random behavior with regards to validation. I noticed that sometimes the validation would pass or fail unexpectedly. It turns out that it was due to the fact that the CKEditor instance creates a separate element for user input and hides the original text area which the validation code validates.  Since CKEditor doesn’t push the changes out to the text area until the control loses focus, if you click on the form submit button, the text area may or may not have been updated, so as a result, the validation may pass or fail unexpectedly.

The solution that I came up with was to add the following code to the form submit button before the form validation code. This ensures that the CKEditor content and the text area are always in sync when the validation runs.

//force each ckeditor instance on page to update their related text area elements so that we can perform validation on those elements 

if (CKEDITOR != undefined) {
   for (var instance in CKEDITOR.instances)
       CKEDITOR.instances[instance].updateElement();
}

Hopes this helps someone that got stumped like I did. Smile

Posted on Thursday, March 8, 2012 6:14 AM | Back to top


Comments on this post: CKEditor and Javascript validation

# re: CKEditor and Javascript validation
Requesting Gravatar...
Thank you very much!

I had the same stupid Problem with CKEditor and the Validation-Script from javascript-coder.com

Now it works perfectly :)
Left by Renox on Nov 24, 2012 1:24 AM

# re: CKEditor and Javascript validation
Requesting Gravatar...
Wow - thanks so much for posting this code snippet. This was a tremendous help!
Left by Leon O'Daniel on Feb 13, 2013 6:31 AM

# re: CKEditor and Javascript validation
Requesting Gravatar...
can u post the complete code ...plz
Left by rohini on Jul 09, 2013 10:04 PM

# re: CKEditor and Javascript validation
Requesting Gravatar...
aaaaaaaaa3441!@################$%%%%^^^^<?php echo "'" ?> <script> this is to test if the form validation works </script>
Left by aaaaaaaa ccccccccccc on Apr 04, 2014 8:49 AM

# re: CKEditor and Javascript validation
Requesting Gravatar...
Thanks it works like a charm
Left by BINIT on May 03, 2016 12:02 AM

Your comment:
 (will show your gravatar)


Copyright © HanSolo | Powered by: GeeksWithBlogs.net