How to change Imperavi redactor's text direction dynamically using jquery

231 views Asked by At

Currently, based on a language selection on a separate drop down, I can attach redactor to a text field and use the language direction from the selected language like this:

this.$('#description').redactor({
    buttons: ['formatting', 'bold', 'italic', 'underline'],
    breakline: true,
    direction: this.direction,
    ...
});

However, if I change the language in the drop down, I would like to dynamically change the direction of my redactor field. If I try the following, it does not work:

this.$('#description').redactor({direction: this.direction});

Does anyone know the correct way of doing this?

1

There are 1 answers

0
gaetanoM On

This code:

this.$('#description').redactor({direction: this.direction});

will never work because you need to start/stop redactor app. Hence the code can be:

$R('#description', 'stop');
app.opts.direction = (app.opts.direction == 'ltr') ? 'rtl' : 'ltr';
$R('#description', 'start');

Another solution can be:

var app = $('#description').redactor({ // <---------------------
    buttons: ['formatting', 'bold', 'italic', 'underline'],
    breakline: true,
    direction: 'ltr'
});
$('#tglDirection').on('click', function(e) {
    $R('#description', 'stop');
    app.opts.direction = (app.opts.direction == 'ltr') ? 'rtl' : 'ltr';
    $R('#description', 'start');
    return;
    //---------------------------
    $(app.container.$container.nodes).find('div[dir]').addBack().attr('dir', function(idx, attr) {
        return (attr == 'ltr') ? 'rtl' : 'ltr';
    });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://imperavi.com/assets/redactor/redactor.min.css?b100">
<script src="https://imperavi.com/assets/redactor/redactor3.js"></script>
<button id="tglDirection">Toggle Direction ltr/rtl</button>
<textarea id="description">
    Could you do an actual logo instead of a font I cant pay you? Can we try some other colors maybe? I cant pay you. You might wanna give it another shot, so make it pop and this is just a 5 minutes job the target audience makes and families aged zero and up will royalties in the company do instead of cash.
</textarea>