I have a text, an icon and a rich text editor (the rich text editor sits inside a reusable element).
When a user clicks on the icon, I want to insert the text into the rich text editor. Any ideas?
What I’ve done so far is set a custom state named “content” on the reusable element and when the user clicks on the icon, the value of the “content” custom state is set to the value of my text. But I don’t know how to then add that text to the rich text editor.
Hi there, @duracel… if I understand your post correctly, all you should need to do at this point is set the rich text editor’s Initial Content field to the custom state, and you should be good to go.
@mikeloc I tried that earlier but it only works in the beginning when the rich text field is empty. If I type something in the rich text field and then I try to press that icon, nothing happens.
I’d trying to append my text (from the custom state) to the rich text editor field every time I press the icon. So if I press the icon 5 times it will be added 5 times. All the existing text inside the rich text editor will still be there, I’m just adding the custom state’s text to it.
Adding the text 5 times if the icon is clicked 5 times is easy enough… just set the custom state’s value to the custom state and append the text. But I’m guessing that still isn’t what you want, right? What is supposed to happen if the user types some text, clicks the icon, types some more text, and then clicks the icon a few more times?
Every time the icon is clicked, the text from the custom state should be added to the rich text field.
So if my custom state’s value is “potato” and I click the icon, “potato” will show up in the rich text field.
If I then type "How to make a " on the next line and press the icon again, “potato” will be added to the end of my rich text field. So in the end the rich text field will have this text:
Okay, I just tested this, and I believe it does what you have described.
Put the rich text editor in a group. Set the group’s type of content to text, and set the group’s data source to the custom state. Set the initial content of the rich text editor to the parent group’s text.
When an icon is clicked, set the custom state to the rich text editor’s value, and append the text associated with the icon. Finally, add another action in the workflow to reset the data of the group that contains the rich text editor.
I think I did everything you suggested and I was able to append the text but if I typed something manually and then clicked the icon again, the text on the left would be appended but the text I typed would disappear.
The final missing piece was setting the custom state (screenshot) to equal the value of the rich text field every time the rich text field’s value was changed.
Not sure if this is the right way though or if I misunderstood your comment and implemented it the wrong way… Because I wonder if this approach of changing setting the custom state every time the rich text field’s value changes would hurt performance (or just cost more money to run, if the end users edit a lot of documents)
This is the icon workflow btw: screenshot
Where “editor A” is the reusable element containing the group + rich text element, and “Content Option’s Display” is the text that is being added.
If what you have is working, I wouldn’t worry about performance issues because you are only setting a custom state. That being said, I am setting the custom state to the rich text editor’s value with the icon’s text appended to it, and it works as expected even when text is typed manually. I’m not sure why it’s not working for you… maybe it has something to do with the reusable element.
You’re right it was because of the reusable element. I managed to get it to work as you described, using a group only. Previously I had that group inside the reusable element, so I couldn’t target the rich text field inside it from the main page. My solution above was just a workaround, but I think I’ll stick to using groups instead of a reusable element this time Thanks for the help.
Thanks for the help.