Issue #573💬 AnsweredOpened November 26, 2017by NorthstarTech1 reactions

Text at specific position in richtexteditor

快速解答by ryandeba1

Hi @NorthstarTech, Can you elaborate on what you mean by "specific cursor position"? Is that the beginning/end of the selection? Or is the target position more dynamic? A code example showing what you have so far (obviously it's OK that it's not going to be completely functional since you're asking about how to add so...

Read full answer below ↓

Question

How to add the text at specific cursor position in richtexteditor? any sample code? Need urgently Thanks,

Answers (3)

ryandebaNovember 28, 2017

Hi @NorthstarTech,

Can you elaborate on what you mean by "specific cursor position"? Is that the beginning/end of the selection? Or is the target position more dynamic? A code example showing what you have so far (obviously it's OK that it's not going to be completely functional since you're asking about how to add some functionality) or a more complete description of what you want would be helpful for me to assist.

From what I've seen the richtexteditor relies on browser contenteditable/selection APIs to insert content at specific positions/ranges, so I think you would want to start there. Check out the result function in the link action in the RichTextEditor object (line 40: https://github.com/artf/grapesjs/blob/688faaaa2a5be891545a45c086a735571d1fb67a/src/rich_text_editor/model/RichTextEditor.js). I think you're going to want to do something similar, but before calling rte.insertHTML(), you'll want to modify the currently selected range so that the content is inserted at the desired location. I think you can get access to the current selection/range through rte.selection().

Here's a few links that may be helpful: https://github.com/artf/grapesjs/wiki/API-Rich-Text-Editor#add https://developer.mozilla.org/en-US/docs/Web/API/Selection https://stackoverflow.com/questions/3771824/select-range-in-contenteditable-div

artfNovember 30, 2017

Thanks Ryan for the detailed explanation, by the way, I think this is the same as #111 so close as a duplication

lock[bot]September 18, 2019

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.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →
Premium option

Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.

Browse premium plugins →

Related tutorials

In-depth guides on the same topic.

All tutorials →

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.