innerText/textContent not working on model
Question
I'm using model.view.el.innerText to capture the innerText of the component in use when I update/change the text using an event, but it returns an empty string (ideally it should return the updated text), although if i use model.view.el.tagName or model.view.el.id it gives the desirable output(h2 and trial respectively). I also tried using model.view.el.textContent but still returns an empty string.
If I undo the update in text, model.view.el.innerText gives me the original text (Account Sign In). Thus, I believe the RTE changes/updates the text differently which does not process seamlessly into the element which is why model.view.el.innerText is returning an empty string.
my component looks like this:
<h2 id="trial" data-gjs-removable="false" data-gjs-draggable="false" data-gjs-droppable="false" data-gjs-stylable="false" data-gjs-highlightable="false" data-gjs-copyable="false" data-gjs-resizable="false" data-gjs-badgable="false" fa-arrow-up="false" data-gjs-toolbar="false">Account Sign In</h2>
my event looks like this:
//track change in text
editor.on('component:update:content', model => {
console.log('New content', model.view.el.textContent);
})
Answers (2)
Used a setTimeout function, worked with mdel.getEl().innerText realised there's a delay
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #639
Re-render Component on Canvas when tagName has changed
I'm trying to build a basic Header component that lets you select H1 to H6 with a trait. But when an option is selected, the canvas doesn't...
Issue #1198
QUESTIONS : Find element in Model
I have custom component and it render below html, I want to update value of h4 tilte and other element on trait changed, but not sure how c...
Issue #1959
[Question] Edit innerHTML in a custom button
Hi All, I am trying to change the text in a button component, but I am not able to edit it. I added this type: I included the editable: tru...
Issue #1961
Some user return
Hello i try to use grapesjs like an enduser to builde a page some returns : how to select row to change width when we use column blocks ? i...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.