Support for multiple tinyMCE instances with different config options.

javascript/src/Helper/tinyMCE.js

@@ -31,18 +31,41 @@ QfqNS.Helper = QfqNS.Helper || {};
             return;
         }
 
-        tinymce.init({
-            selector: ".qfq-tinymce",
-            setup: function (editor) {
-                editor.on('Change', function (e) {
-                    console.log('Editor was changed');
-                    var eventTarget = e.target;
-                    var $parentForm = $(eventTarget.formElement);
-                    $parentForm.trigger("change");
-
-                });
+        $(".qfq-tinymce").each(
+            function () {
+                var config = {};
+                var $this = $(this);
+                var tinyMCEId = $this.attr('id');
+                if (!tinyMCEId) {
+                    QfqNS.Log.warning("TinyMCE container does not have an id attribute. Ignoring.");
+                    return;
+                }
+
+                var configData = $this.data('config');
+                if (configData) {
+                    try {
+                        config = JSON.parse(configData);
+                    } catch (e) {
+                        QfqNS.Log("Exception while parsing JSON: " + configData);
+                        QfqNS.Log(e);
+                        return;
+                    }
+                }
+
+                config.selector = "#" + tinyMCEId;
+                config.setup = function (editor) {
+                    editor.on('Change', function (e) {
+                        console.log('Editor was changed');
+                        var eventTarget = e.target;
+                        var $parentForm = $(eventTarget.formElement);
+                        $parentForm.trigger("change");
+
+                    });
+                };
+
+                tinymce.init(config);
             }
-        });
+        );
     };
 
     tinyMce.prepareSave = function () {

mockup/richtexteditor.html

@@ -67,6 +67,18 @@
 
         </div>
 
+        <div class="form-group">
+            <div class="col-md-2">
+                <label for="text2" class="control-label">Rich Text Editor</label>
+            </div>
+
+            <div class="col-md-6">
+                <textarea id="text2" class="qfq-tinymce" name="rte">Input
+                </textarea>
+            </div>
+
+        </div>
+
         <button type="submit">Do</button>
 
     </form>