Iāve gotten reports from my client and just tested this. We use the Stop typing trigger to execute saving of the text in the editor to the database (as a replacement for autobind).
However, whenever that happens, the editor will jump back to the first character in the editor. This gif explains it best:
Is there any way to get around this or is this an issue that you can have a look at?
We have a team of editors working with texts, and naturally this issue is very disturbing to their workflow as they need to physically click back to the right position if they stop typing for just a second.
We have tested the plugin and this issue is not reproducing on our side, unfortunately. Without knowing more about your workflow and plugin settings, here is a hint that might help. Please try to use one of the following plugin elements:
Because the simple RTE is deprecated, unfortunately. Try both, but it might be best to use the ZQ RTE one with the Stop Typing event. Also, make sure to use this event properly and select the right element from your page and if you perhaps donāt locate duplicate plugin elements with the same name.
However, if you still experience the same or any other issues, please share more details like screenshots/screencast of your app and workflow, window of the plugin element settings, browser and OS you are using. This way, we can better understand whether it is a plugin issue or not, then get back with a reply asap.
Thanks for getting back to me. Iāll dig into your suggestions and see if thereās anything weāve missed on our side, and let you know how it goes.
Iāve set up completely new element on a blank test page now, using the ZQ RTE element on version 1.61.0. Iāve sent you a link to the page in a PM where you can see if itās replicable that way.
Iām not changing any settings on the element except for the Initial content
It happens both if I save HTML and if I save text
It happens both in Chrome and Firefox (Mac)
It happens in both the ZQRTE and the ZQLiteRTE elements
I see youāre not accepting messages on that channel, but let me know if I can send the link to you in another way.
UPDATE:
Iāve done some more research, and think Iāve been able to circle it in more closely:
Cursor skip
If the Initial content is left blank, the cursor no longer skips back to the beginning when the content is saved. So itās definitely connected to when the initial content is refreshed. In the gif below, Iām showing the saved text in a regular text element above the ZQRTE element, but leaving the initial content setting blank:
Sizing error
The sizing error only occurs when the element is inside of a group. When placed directly on the page, it renders correctly, but inside of a group, it displays incorrectly. The element on the right in this illustration is inside of a group with red borders. They should both align with the red rectangle, but you can see the one on the right not lining up correctly:
Hi @petter, we have found the reasons for both issues.
For Cursor skip, if you leave the Content blank, it will not reproduce the cursor reset behavior, indeed. Also, if you type some initial content as static:
It will still not reproduce this behavior, it works fine. The reason for this cursor reset, is actually in this way of introducing the content value:
As it is a dynamic value for the actual variable within your database, Bubble will refresh the app and reset all inputs from your app when you make the changes to the database, which is why it is throwing that cursor at the beginning. Unfortunately, it is something we cannot influence, as it is just the way Bubble works.
In order to solve it, it would be best to just leave it blank or you could set initial content with a static value.
For Sizing error, this might be a plugin issue, indeed. Our development team is already checking on this one. Weāll get back to you with an update on this matter asap.
Weāre reaching out back to notify that weāve fixed the height issue. Please upgrade the plugin to the latest version, refresh your app and give it a try.
Sorry for my delayed reply, been a hectic weekā¦ first, thanks for following up, I really appreciate it.
For the cursor skip, I see what you mean that Bubble resets the input after saving. For now Iāve gotten around it by storing the initial content in a state and loading it from there, instead of setting a dynamic value as the initial content.
For the size issuee, Iām still seeing this on my end. Iām on version 1.62.00, and have cleared and reloaded and tried in both Chrome and Firefox. Is there anything I can send you that can help get to the bottom of this one?
Weāre glad itās working for you. Also, thanks for the insights with setting the initial content as a state!
Have you actually upgraded the plugin to the latest version? Because this issue is not reproducing on our side anymore. We have fixed it and now the plugin elements can be placed into a Group element, keeping its size: (the following pictures for illustration purposes)
Please try to make sure the plugin has been upgraded. Then, perhaps try to add a new plugin element on the page and place it inside a Group element and see how it behaves on preview. It should not be reproducing on whether itās Chrome or Firefox; Mac or Windows. However, if you still experience the same issue, please share screenshots of your app and the exact steps of how to reproduce it, so we could check on our side whether itās still a plugin issue or not, then provide a working solution asap.
We hope you are doing well. Weāre actually reaching out to ask for your help on this matter regarding the cursor skip issue:
Could you please describe how exactly youāve managed to workaround this by using a state. It would be best to share a couple of screenshots of your app and workflows, because other users are having the same problem, so it would be great to replicate the workaround! Meanwhile, our development team will check if itās possible to improve the plugin and eliminate this behavior asap.
Yes, sure. Itās very simple, so not sure if screenshots needed, but Iāll add if you want:
On page load (or data type load) set a State of type text so that it contains the text from the data type field you want to edit
Set that state as the initial content of the ZQEditor
As the state doesnāt change even when you save, the input remains āundisturbedā by Bubbleās element reset that would normally cause the cursor to skip.
Element height
For this one, the reason itās taken me time to get back is that Iām trying to get to the bottom of what circumstances causes this (as it happens sometimes, but not always).
Thanks a lot for your feedback! This workaround is very handy. Additionally, our development team has managed to fix this cursor skip issue within the plugin itself. Please upgrade it to the latest version, refresh your app and give it a try, without necessarily setting a state. You could simply insert dynamic data into Content field, so even if you make changes to the database and it gets updated in the editor as well, the cursor will not jump anymore.
Thereās one small change that Iād like to ask. Leaving the Placeholder field empty will result in the editor showing Null instead of simply nothing. Would you mind leaving that text empty instead?
Does this allow tables and if so can I just add plug in, and change the current rich text input bubble input fields and all settings (like default data population and saving inputs or binding) hold?