Issue #1706Opened January 3, 2019by SeongwoonHong1 reactions

[Question]: How to get href from rte?

Question

capture

I have this rte toolbar where you can type and click 'save' and it's going to create a link for the selected text. but the problem is that the value of the input field should be dynamic based on selected text. If the selected text has href and the input field should show the href in there. How do i get href for the selected text in rte result or update function? This is a piece of my code

this.editor.RichTextEditor.add('custom-link', {
          icon: '<div><input name="link" id="custom-link-input" value="" /><button type="submit">save</button></div>',
          attributes: {title: 'Link', class: 'gjs-rte-action custom-link'},
          event: 'change',
          result: (rte) => {
            rte.insertHTML(`<a href="${this.currentLinkValue}">${rte.selection()}</a>`);
          },
          update: (rte, action) => {
            console.log('2')
            console.log('rte.selection().toString() = ', rte.selection().toString());
            console.log('this.editor.getSelected() = ', this.editor.getSelected())
             // here i'd like to get the href of the selected text if it has one.
          }
        });

document.getElementById('custom-link-input').addEventListener('input', (e) => {
          this.currentLinkValue = e.target.value;
        });

thank you Artur

Answers (3)

SeongwoonHongJanuary 5, 20191 reactions

@artf WOW you save my life!Thank you! I have no idea how many hours to figure this out by myself... thank you thank you! it's working now.....!

artfJanuary 5, 20190 reactions

rte.selection() returns the Selection object which you can use to detect the pointed node (from which you can get all the attributes you need)

SeongwoonHongJanuary 5, 20190 reactions

@artf Could you give me an example of doing it please? I've tried lots of stuff but couldn't find a way to get any attributes using rte.selection().... I really appreciated it Artur.

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...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.