Trouble with rich text on wix code

Ask the community
,
1

Hi there.

I am using wix code and dynamic pages to insert rich text in a collection from the html text editor. No problem.
But what I need is read the collection and put the content of a rich text field (already created) into the html text editor, let the user to change it and then save it.
I dont know how to do for filling the html text editor with the content of the rich text field. Could anyone help me and send me an example code ?
Thanks a lot.

2

Since you already have the rich text editor in place, all you need now is to send the contents of the rich text field in the database to the rich text editor in the HtmlComponent.

Use the messaging as described in the article Working with the HTML Component in Wix Code .

3

Thanks. I readed the article before post yhe question. But it doesn’t work. Maybe I am doing aomething bad. The code I am using is:

import wixData from ‘wix-data’;
import wixUsers from ‘wix-users’;

export function page1_viewportEnter(event, $w) {
let user = wixUsers.currentUser;
let userid = user.id;
//search in collection the record of the user id
wixData.query(“aaaaa”)
.eq(“usid”, userid)
.find()
.then((results) => {
let items = results.items;
let item = items[0];
let hhh = item.historial;
$w(“#html1”).postMessage(“hhh”);

	});

}

The field “historial” is in rich text format. I have simplified the code because is too long. Basically this is the part regarding to html text editor. The rest of code works perfectly so I an ensure the field is populated, but the html text editor screen remains empty.
What am I doing bad?

4

You need to make sure that the onMessage() function in the code int the HtmlComponent received messages from the page and sets the input ( theMessage ) field. The code in the article doesn’t have this, so you need to add this yourself.

5

Excuse me again, but I did (hope). The html code is:

I think it is ready to send and receive messages, isn’t it?

6

I’m not sure why, but in the onmessage() function you have a postMessage which sends the text from the editor to the page. The onmessage() function needs to receive the already existing text from the page and then set the editor to that text. Something like this:
CKEDITOR.instances.CK1.setData(event.data);

Refer to the forum post Add a rich text editor and connect it to a collection for a discussion of different possibilities.

7

Thanks a lot. It finally works.

8

:tada: