How to capture a event on changing value in a text box -


I have a html form with the below input element allowing users to enter a number. What I need to accomplish is on entering a number (number key press) i need to collect the take a value and do some calculation and display the result reactively?
What meteor event is available for me to accomplish that? how do i capture the data? so that i can do the calculation and update the DOM

Any help or pointer would be greatly help.

  'keyup #my-input-element': function(event) {
      if (event.which >= 48 && event.which <= 57) {
        var numberPressed = event.which - 48;
      // Do whatever you want with numberPressed
      // like set a Session value that is reflected in the DOM via a helper
      var calculatedResult = numberPressed * 100;
      Session.set('calculatedResult', calculatedResult);

And in the accompanying html file you would have something like:

<template name="myTemplateName'>
  <input type="text" id="my-input-element" />
  Last number typed times 100: {{calculatedResult}}

But to wire these up, you’d need:

  calculatedResult: function() {
    return Session.get('calculatedResult');

Just wrote all this off the top of my head, so apologies if I’ve made a mistake somewhere, but this is the basic gist of it.

  'input #element': function (event, template) {
    Session.set("whatever", event.currentTarget.value);

this will change reactively as you type.

Generally, a good place to start is:


Hey! There’s an interesting package - manuel:viewmodel - which might be helpful for more complex cases. Take a look at examples here:

I haven’t used it yet, and would love to hear other fellows’ thoughts on pros & cons of such approach.