Change value of reactive variable in hook in Meteor

Question

I have

Template.templateName.onCreated(function() {
  this.variableName = new ReactiveVar;
  this.variableName.set(true);
});

and in templateName I have an autoform. I need to set the reactive variable variableName to false when the autoform is submitted.

I have tried

AutoForm.hooks({
  myForm: {
    onSuccess: function(operation, result) {
      this.variableName.set(false);
    },
  }
});

but it doesn't work since this. does not refer to the template templateName as it does in helpers and events. It would have worked if I used sessions instead since these are not limited/scoped to specific templates.

What can I do to change the reactive variable in an autoform hook?

I have also tried

AutoForm.hooks({
  myForm: {
    onSuccess: function(operation, result) {
      this.template.variableName.set(false);
      this.template.parent.variableName.set(false);
      this.template.parent().variableName.set(false);
      this.template.parentData.variableName.set(false);
      this.template.parentData().variableName.set(false);
      this.template.parentView.variableName.set(false);
      this.template.parentView().variableName.set(false);
    },
  }
});

When using console.log(this.template) it does print an object. If I use console.log(this.template.data) I get

Object {id: "myForm", collection: "Meteor.users", type: "update", doc: Object, validation: "submitThenKeyup"…}

I use the reactive variable variableName to determine whether to either show the editable form or the nice presentation of data for the user. Maybe there is another better way to do this.

Answer 1

Edit of onCreated:

Template.templateName.onCreated(function() {
  this.variableName = new ReactiveVar(false);
});

You may want to add a helper function to grab the Template instance:

Template.templateName.helpers({
    getVariableName: function() {
      return Template.instance().variableName.get();
    }
});

and then you could potentially call within your form logic

AutoForm.hooks({
  myForm: {
    onSuccess: function(operation, result) {
      Template.getVariableName.set(false);
    },
  }
});

The MeteorChef has a great article about reactive variables/dictionaries Reactive Variables.