Watching input changes to enable submit button


#1

Hi everybody!
My modal has a little form with a text input and a submit button. I would that button class change reactively from “disabled” to “enabled” when input value is typing, otherwise it remains in disabled class.
How can I do it with Meteor?
Thanks!


#2

With good old Blaze you can do:

Template.home.onCreated(function () {
  this.text = new ReactiveVar();
});

Template.home.helpers({
  buttonEnabled: function() {
    return !!Template.instance().text.get();
  }
});

Template.home.events({
  'change #input-id': function() {
    Template.instance().text.set($("#input-id").val());
  }
});

This is an area where view models truly shine. If you’re using ViewModel then the code is reduced to:

Template.home.viewmodel({
  text: '',
  buttonEnabled: function() {
    return !!this.text();
  }
});

#3

Ir works! viewmodel package is awesome!
Thanks @manuel