CODEWITHSUNDEEP
phpjqueryhtmllaravel-5tinymce
Sam Chahine
Sam Chahine

Reputation: 620

Double instance of tinyMCE on one page

I have been trying to add two instances of the TinyMCE editor into one page and I couldn't, so I did a bit of research and tried to separate the id's for each <textarea>. For this I added this code to my JS:

JS

  tinymce.init({
        selector: "#mytextarea1",
        mode : "exact",
        elements :"area1",
        menubar: false,
        statusbar: false,
        height : 240,

    });

    tinymce.init({
        selector: "#mytextarea2",
        mode : "exact",
        elements :"area2",
        menubar: false,
        statusbar: false,
        height : 240,

    });

Since I am working with laravel 5, this is the code that I used for the forms:

Laravel - Blade

TinyMCE Instance #1 (Works)

{!! Form::textarea('noteContent',null,array( 'id'=>'mytextarea1')) !!}

TinyMCE Instance #2 (Doesn't work, instead shows normal textarea box)

{!! Form::textarea('noteContentEdit',null,array( 'id'=>'mytextarea2')) !!}

Am I doing something wrong? I read I had to make sure the selector's are different in each element and I thought I had, but I must be doing something wrong, Thank you in advance.

P.S This is the SO question I tried to incorporate into my problem.

Upvotes: 1

Views: 1205

Answers (1)

Sam Chahine
Sam Chahine

Reputation: 620

Okay so all I had to do was edit the jQuery code to be this:

jQuery

tinymce.init({
            editor_selector : "mceCreate",
            mode: "textareas",
            menubar: false,
            statusbar: false,
            height : 240,

        });

tinymce.init({
            editor_selector : "mceEdit",
            mode: "textareas",
            menubar: false,
            statusbar: false,
            height : 240,

            });

Adding an editor_selector attribute to each and instead of id's in the tags, I used classes. I also changed the mode attribute to textarea.. Now it works.

Upvotes: 1

Related Questions