Search code examples
tinymcebidirectional

How can I set the directionality of different TinyMCE editors based on the direction attribute of the input they replace?


I have a page with multiple textareas to be replaced with TinyMCE. Some of the Textareas take arabic text, some english text. The textareas have the dir-attribute set correctly according to the input they should receive.

How can I set the directionality of the different Editors according to their textareas? I can set the directionality for all instances like this:

$('textarea.advanced_editor').tinymce({
    ⋮
    plugins : "…,directionality,…",
    directionality: "rtl",
    ⋮
});

But how can I set different direction for each editor?


Solution

  • In the end I came up with this:

    $('textarea.advanced_editor').tinymce({
        ⋮
        plugins : "…,directionality,…",
        directionality: "ltr",
        ⋮
        setup: function (ed) {
            ed.onInit.add(function(ed) {
                var direction = $('[name="'+ed.id+'"]').attr('dir');
                ed.getBody().dir = direction;
            });
        },
        ⋮
    });
    

    I used the events-based solution like @Thariama supposed and referenced back to the dir-attribute, which I know to be always set correctly.