1

I have a template (blogContent.html) which loads the text on the page using helpers in (blogContent.js). Once the page has loaded, I'm trying to select some text on blogContent.html and highlight it.

To get the selected text, I'm trying to do something like this

Template.blogContent.onRendered(function(){
    if (window.onSelection) {
        var selectedText = window.onSelection().toString();
        console.log(selectedText);
    }
});

However, I'm encountering two issues with it. 1. The if block is always executed when the page is loaded and never afterwards i.e. not when I selected some text. 2. Because of (1), console.log outputs a null string on client console only once when the page loads and nothing heppens afterwards.

Any pointers are much appreciated. I'm new to webdev and meteor. Thanks a lot.

VLAZ
  • 26,331
  • 9
  • 49
  • 67
jingyang
  • 13
  • 3

1 Answers1

0

window.onSelection is not a valid function or property. You may be thinking of window.getSelection().

Meteor doesn't re-render the template unless the data inside of it changes, so the onRendered function won't be called.

What you want here is plain old jQuery -- see this question for how to create a listener for text selection.

Community
  • 1
  • 1
maxko87
  • 2,892
  • 4
  • 28
  • 43
  • That is exactly what I ended up doing. Thanks for the explanation. I'm using rangy right now on mouseup event on a particular class of elements. – jingyang Oct 03 '16 at 10:21