se-rtl not set in document created by suneditor

[Saeeed-B]

@JiHong88 hi

The se-rtl class is set in the editor and works well.
But there is no editor output in the content. And prevents rtl from being applied to the content display.

This image shows that the se-rtl class is applied correctly in the editor :

But the image below, which is related to the display of content, clearly shows that the se-rtl class is not set at all.

As a result, the text is displayed correctly in the editor and is from right to left.
But the screen is not right and from left to right.

[Saeeed-B]

@JiHong88
Until now, I have been manually giving the output document to the right-to-left class, but I can not continue because I need to create left-to-right documents as well.
So it has to work right.

[Saeeed-B]

@JiHong88 Maybe I'm using the wrong method to get the output of the editor.
Do I have to use the getContents method to get the output of the editor?
I use getContents.
?
?

[Saeeed-B]

@JiHong88 hi ?!

[Saeeed-B]

@JiHong88 hi Please Gaide me , tanks

[JiHong88]

@Saeeed-B Sorry for the late reply.
In the meantime, I haven't been paying attention because of a lot of things.

Getting the content with "getContents" is correct.
However, there is currently no function to import "div" containing class "se-rtl".
Use the "core.options.rtl" option to save the state yourself.

It will be improved in version 3.0.0.

[Saeeed-B]

@JiHong88 how please example ,
tank you for answer

[Saeeed-B]

@JiHong88
My site is multilingual and of course some documents are rtl and some documents are ltr.
I should normally be able to change this for each document

[Saeeed-B]

@JiHong88
You added the change direction button in version 2.42, and thank you for that.
But these buttons only work in the editor environment and have no effect on the output document.
@JiHong88 This is an urgent need for me and I am confused

[JiHong88]

@Saeeed-B Do you want to get content with "rtl" option like below?

<div class="se-rtl">
  <p>....</p>
</div>

[Saeeed-B]

@JiHong88
I want the output document to be rtl whenever I rtl it with the direction button.

If you remember added a button for DIRECTION:
#838

I want this button to work exactly in the output document and in fact the output document is rtl
Of course, this should be the case with all editors.
But this is not the case and this is a bug.

[JiHong88]

For the output document to be "rtl", the class of the parent "div" must be "se-rtl".
How do you create an output document?

[Saeeed-B]

@JiHong88
Well, the direction of each document is different according to the language of that document.
What happens to documents that are ltr if I set se-rtl to display the output document?
The display of ltr documents is cluttered.
This must be adjustable with the button inside the toolbar.

I am now manually (with css style) setting the direction for each document.

[Saeeed-B]

@JiHong88
I want to tell you exactly
It may even be one ltr and the other line rtl.
And the direction of each line must be adjustable with a button. Like a button that changes color.
Of course, it must work correctly in the output document and set the direction in the output document

[JiHong88]

@Saeeed-B
I don't know exactly what you want.
"se-rtl" sets the document orientation of the current editor.
Do you want to make two versions of the output document "rtl" and "ltr"?

[Saeeed-B]

@JiHong88
Suppose we have two documents with two different languages

1. Document in English
2. A document in Arabic
   English document must be ltr.
   And the Arabic document must be rtl.
   Now how do I create these two documents with different directions with one editor?

[Saeeed-B]

@JiHong88
Do you think this is true that I can manually adjust to each document that RTL or LTR?
This is definitely not correct.
You must adjust the DIRECTION editor for each document.
This should be done by the button that has repeatedly mentioned.
This button now, only editor RTL or LTR, not the output document.
This button also needs to be class, RTL or LTR for the output document.

[Saeeed-B]

For the output document to be "rtl", the class of the parent "div" must be "se-rtl".

In short
I expect this button, set rtl in the output rtl document.
Without I need to give the se_rtl class to div, with hand.

My reason is that if I give div to the class se_rtl, documents that are in English and ltr, will not be displayed correctly.

In fact, your editor is not flexible right now,
And its output must be either rtl at all or ltr at all.

And this is not true,
the editor must also set rtl class for rtl documents, and it must also set ltr class for ltr documents.

With this Feature , I can write both rtl and ltr documents.

@JiHong88 Could I say what I meant?

[JiHong88]

Um.. Do you want to output document two versions of "rtl" and "ltr" in one editor? right?

[Saeeed-B]

@JiHong88 no i dont want two version (rtl & ltr) of one document .

But I want to change the DIRECTION of output one document, so if I want to set the Direction to RTL, and if I want to set the Direction to LTR.
I'm talking about one document in one editor.

[Saeeed-B]

@JiHong88 and i want , this changing , set with this button .

@JiHong88 Now this button does not affect the output document.

[JiHong88]

@Saeeed-B
What exactly does "output document" mean?
How are you making this?

[Saeeed-B]

@JiHong88
The scenario is very simple. There are two modes

1. If we hit the button and the RTL editor, the SE_RTL class is set in the output document. As a result, the output document is also RTL.
2. But if the button was in the LTR mode, the Se_RTL class output is set. As a result, the output document is also LTR

[Saeeed-B]

@JiHong88
I mean the output document, when we want to display the content of the editor somewhere else.
For example, in the blog, we create a post in the editor. I mean from the output document, when we want to display that so on the blog

I am not English language, I think this makes the issue not be clear.

[JiHong88]

I am not an English speaker either. :)

Is there a problem with getting the rtl content with "getContents"?
I checked that "rtl" is not applied in "print" and "preview".

[Saeeed-B]

@JiHong88
I mean from the output document, the value I get from the getContents function.

[Saeeed-B]

@JiHong88 The vlue that gives the getContents function does not include RTL class. Also does not include LTR class

[Saeeed-B]

Is there a problem with getting the rtl content with "getContents"?
I checked that "rtl" is not applied in "print" and "preview".

@JiHong88 Yes, exactly .

rtl and ltr not in :

1. print
2. preview
3. value of getContents

[Saeeed-B]

@JiHong88
Probably print and preview are outgoing from value of getContents.

[JiHong88]

I'll fix the "print", "privew" bug.

All content in the editor must be in <div class="sun-editor-editable">.
If "rtl" mode, this <div> should contain the "se-rtl" class (<div class="sun-editor-editable se-rtl">).
https://github.com/JiHong88/SunEditor#3-contents-display

"getContents()" gets the content inside the <div>.
You need to put the content you get with "getContents()" inside a <div>.

[Saeeed-B]

oh No :(

@JiHong88 the editor should set se-rtl if is rtl mode ,, not me

[JiHong88]

simple example

<div class=`sun-editor-editable ${options.rtl ? "se-rtl" : ""}`>
 {getContents()}
</div>

[Saeeed-B]

@JiHong88 the editor should set se-rtl if is rtl mode ,, not me.

Because some of the documents may be Ltr. I can't change the DIV for each document

This is bound by the editor

[JiHong88]

Currently: getContents() => <p>...</p><p>...</p>

what you want: getContents() => <div class="sun-editor-editable se-rtl"><p>...</p><p>...</p></div>

do you mean this?

[Saeeed-B]

simple example

<div class=`sun-editor-editable ${options.rtl ? "se-rtl" : ""}`>
 {getContents()}
</div>

@JiHong88
I do not have access to option , unless I save the RTL mode in the database.
That doesn't work right
Should be the output of the editor containing se-rtl if rtl

[Saeeed-B]

Currently: getContents() => <p>...</p><p>...</p>

what you want: getContents() => <div class="sun-editor-editable se-rtl"><p>...</p><p>...</p></div>

do you mean this?

@JiHong88 Yes, exactly .
And the right and principled work is the same.

[Saeeed-B]

Currently: getContents() => <p>...</p><p>...</p>

what you want: getContents() => <div class="sun-editor-editable se-rtl"><p>...</p><p>...</p></div>

do you mean this?

@JiHong88
All editors work as like this , Unlike your editor.
So this is a bug in your editor

[JiHong88]

It is not possible to modify this function in the current version, as it is not backward compatible.
The related issue will be fixed in v3.0.0.

For now, I'll add a getFullContents() function that performs the same function

[JiHong88]

Before the "2.42.1" version update, you can use it like this:

function save() {
 const contents = `<div class="sun-editor-editable ${editorInstance.options.rtl ? "se-rtl" : ""}">${editorInstance.core.getContents()}</div>`;
 console.log(contents);
}

[Saeeed-B]

@JiHong88 I am in this few months.
Thank you if solve this.

Thank you very much for your follow up.
Be sure when you submit documentation for programmers, I will help you in development and debug.

[JiHong88]

The 2.43.0 version has been updated.
If this issue has not been resolved, please reopen this issue.
Thank you.