Get selectedText and changing the text on a button in Meteor


#1

Hi,

I would like to understand how the getSelection function works. Therefore I want to do a little test. I want to display my selected text on a button.

My code:

<template name="seltext">
This is a test test test test
<input type="button" id="test"  class="new" value="pause">
 </template>

and the .js

Template.seltext.events({
  'click .new': function(){
    var text = "";
    if (window.getSelection) {
      text = window.getSelection().toString();
    } else if (document.selection && document.selection.type != "Control") {
      text = document.selection.createRange().text;
    }
    return text;
    value = text;
}});

So there are two things I don’t understand. Does the getSelect function work and how do I change the displayed text on a button? I thought value= … would do it but it doesn’t. Is something like this not handled through events?

Thanks in advance


#2

Several issues here:

  1. is that you are binding to the click event. When you click, I believe any text you had selected would then be unselected.
  2. You are returning before you set your variable “value”, so the last line of your event is never reached.
  3. Lastly, you can’t just set a value variable and have that work. Try this:
$('#test').prop('value', text);

#3

That works, holy cow. Thank you! But why ?


#4

At the point where you have clicked, the DOM is ready (and accessible) from the event that you have bound to in your code. $(’#test’) is how you select the DOM element that has the ID “test” with jQuery. At that point, you can set that value of the test on the button, using the prop function.

See here for more info.


#5

Thank you so much !!!


#6

Not a problem !!!