CODEWITHSUNDEEP
javascripttypescripttinymceselectionbookmarks
Dridriun
Dridriun

Reputation: 21

Losing selection when inserting text into TinyMCE at index with bookmarks

I'm writing code in Typescript and I'm trying to insert text into TinyMCE at cursor index. I have a dropdown with different strings to insert and I want to insert them on click.

When i call this function twice, the index attribute has -1 value so all my text is ereased, it seems that bookmarks doesn't recover selection properly : 

  addCustomTag(tag: string) {
    let bm = this._editor.selection.getBookmark(0);
    let selector = "[data-mce-type=bookmark]";
    let bmElements = this._editor.dom.select(selector);
    this._editor.selection.select(bmElements[0]);
    this._editor.selection.collapse();
    let elementID = "######cursor######";
    let cursorPosition = '<span id="' + elementID + '"></span>';
    this._editor.selection.setContent(cursorPosition);
    let content = this._editor.getContent({ format: "html" });
    let index = content.indexOf(cursorPosition);
    this._editor.dom.remove(elementID, false);
    this._editor.selection.moveToBookmark(bm);

    let tagToInsert = '((' + tag + '))';
    let bookmark = this._editor.selection.getBookmark(0);
    cursorPosition = '<span id="' + bookmark.id + '_start" data-mce-type="bookmark" data-mce-style="overflow:hidden;line-height:0px"></span>';
    content = this._editor.getContent({ format: "html" });
    let part1 = content.substr(0, index);
    let part2 = content.substr(index);
    let contentWithString = part1 + tagToInsert + cursorPosition + part2;
    this._editor.setContent(contentWithString, ({ format: "raw" }));
    this._editor.selection.moveToBookmark(bookmark);
  }

I think there is a problem with this line but I don't know how to fix it :

this._editor.selection.setContent(cursorPosition);

Can you help me please ?

Thanks by advance

EDIT :

I found a simple solution to avoid all my problems :

 addCustomTag(tag: string) {
    this._editor.execCommand('mceInsertContent', false, '((' + tag + '))');
 }

Upvotes: 2

Views: 596

Answers (1)

Dridriun
Dridriun

Reputation: 21

I found a simple solution to avoid all my problems : 

 addCustomTag(tag: string) {
    this._editor.execCommand('mceInsertContent', false, '((' + tag + '))');
 }

Upvotes: 0

Related Questions