How to get JQuery and TinyMCE to work
Wednesday, September 12th, 2007I 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:
<head>
<!-- Tiny MCE -->
<script type="text/javascript" src="/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({ mode : "none"});
</script>
<!-- JQuery -->
<script type="text/javascript" src="/js/jquery/jquery-1.2.js"></script>
</head>
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:
<form action="submit-ajax">
<textarea id="editor" ...>
...
</form>
<script type="text/javascript">
tinyMCE.addMCEControl(document.getElementById("editor"), "editor");
</script>