Sep 122007
 

I was just having a ton of issues getting JQuery and TinyMCE to work. Sometimes loading of TinyMCE would hang and never complete and other times I would lose my tinyMCE or jQuery objects for some reason. Well, I’m not sure what the error was, but I finally got it working. It seems that you first need to completely load and initialize TinyMCE before loading JQuery. Here’s my code:

This seems to work and allow me to do everything AJAX style and use TinyMCE editors in my AJAX forms (i.e. forms that I download the HTML for and that I submit via AJAX). Here’s a simple form snippet that is downloaded via AJAX and placed into a div:

  16 Responses to “How to get JQuery and TinyMCE to work”

  1. Hi Brian,

    interesting. I used prototype and scriptaculous with tinymce and fckeditor before, and they worked for the most part except sometimes they swallow up and mess up the text that’s entered..
    i’m guessing it’s because jquery overrides a lot of stuff and that might conflict with some of tinymce’s initialization code somehow..
    there really needs to be a lot better “encapsulation” or namespacing (for lack of a better word) of frameworks.
    otherwise, they conflict with each other, or with other third party js stuff that don’t use their syntactic sugar.

  2. JQuery has a noconflict() method you can use to override it’s use of $ if needed….. and set it to be $Jquery or $j or what ever you want instead, very helpful when mixing up with other frameworks.

  3. dude – after hours and hours of searching, trying to get this work you finally provided the solution. THANK YOU!!

  4. Whew… many thanks from me too! Everything works perfectly now, after at least one day of wasted hours. Thanks again!

  5. I’m trying to submit a for using ajax(ajaxSubmit) in jquery. In this form i have tinyMCE for a textarea field. It’s obvious the pb is caused by the tinyMCE editor, but don’t have any clue on why it’s not sending the contents of the tinyMCE textarea.

    Any ideeas, please?

    Thanks in advance

  6. Thank you! You helped me a lot! I was having a problem with jquery form ajax plugin and tiny mce editor. Now all works perfect! You made my day.

  7. Kudos to you, mate. Saved me some headaches with this little tip. (addMCEControl is deprecated, I believe, but you can just re-init with the specific textareas and all is well.)

  8. Hello Brian. I have a question about jQuery and input type “text”. It seems not to work. Got any solution why?

  9. @Tarre

    Not sure what your issue is. Can you explain it in more detail?

  10. what modification i need to do to use youtube plugin with tinymce as i am using jquery.

  11. Thank you so much.

    I have a deadline to tomorow for the project, and this type of issues are very troubled.

    I never imagined it was about jQuery.

  12. That really helped
    i was working
    that really helped as i’m working on newsletter creation module using another jquery plugin for displaying other controls

    thanks anyway

  13. Thank You Very Much…

    This page:
    http://maestric.com/en/doc/javascript/tinymce_jquery_ajax_form

    Is really awasome and very usefull

  14. Thanks alot it’s working.

 Leave a Reply

(required)

(required)

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">