Create a Rich Text Editor Using the HTML Component

i was following this tutorial to create a Rich Text Editor
the problem is that i followed same steps but couldn’t get the expected results
i want to enter some customize able text using text editor when i click on the submit button nothing happens. there is something wrong with my code(javascript)

link to the tutorial: Velo Tutorial: Creating a Rich Text Editor Using the HTML Component | Help Center |

Have you checked that the IDs of the components matched the code you’ve written? Is the myText element is really a text element? Is seems like you’ve added a user input instead of a text element .


1 Like

yes u are right i added a user input instead of a text element and that was the cause of my problem
thank you for pointing out the problem, as i have still much to learn

hello, I too am having a challenge with RTF fields. I have successfully update my collection with the RTF Editor input. However, I am not seeing the data from my TEXT field (connected to my collection) appear in the RTF Editor so I can make changes. Can you help please?

I was getting errors trying to use this tutorial as well. Then I realized they didn’t have an “#” in front of myHtmlComponent. Here is the correct code.

$w.onReady( function () {
$w(“#myHtmlComponent”).onMessage( (event) => {
$w(‘#myText’).html =;
} );
} );

The code above works, the text in #myHtmlComponent is being formatted as per the H1, H2, H3 etc. styles from my website’s style theme. When I click the “Submit Text” button that is part of the #myHtmlComponent field, the content is being copied into the #myText (paragraph text) field correctly.

My problem is when I click the main form “Submit” button the #myText (paragraph text) field content is not being copied into the “eventDescription” (richText field) in my “Events” collection.

All the other fields in the collection get populated from the form and I do not receive an error message.

Can anyone help me out?

Many thanks!