javascriptsessionmeteordom-eventsmeteor-helper

Session variable not being picked up in meteor helper


I have a select drop down. A change event triggers session variable to be set. I want to use this session variable to populate a table, however, the session variable is not being read by the template. Where am I going wrong?

<template name ='defaultTemplate'>
        <label for="Schema" class="control-label">Select the Schema</label>
        <select required="true"  class="form-control" id="schemaNameId">
            <!-- <option default>Select Schema </option> -->
            {{ #each schemaNames}}
            <option value="{{schemaName}}">{{schemaName}}</option>
            {{/each}}
        </select>

The console log at this point, indicate undefined. After I select something from the drop-down, that value gets set as the session variable.

This table below is in continuation to the above template. However, the console log does not seem to print anything pertaining to schemaLabel helper

<table class="table table-bordered table-condensed">
        <thead>
            <tr>
                <td style="width: 85px">Label</td>
                <td>Current Value</td>
                <td style="width: 250px">New Value</td>
            </tr>
        </thead>
        <tbody>
            {{#each schemaLabels}}
            <tr>
                <td>{{this.label}}</td>
                <td>{{this.value}}</td>
        </tr>
        {{/each}}
    </tbody>
</table>
</template>

Event:

At first, the session variable value is undefined. As I keep changing the selected element in the drop down, the session variable value keeps changing, this is good.

Template.defaultTemplate.events({
  "change #schemaNameId": function(event, template){
    var selectValue = template.$("#schemaNameId").val();
    // console.log(selectValue +" is selected from dropdown - message logged in events");
    Session.set("selectedSchema",selectValue);
    console.log(Session.get("selectedSchema")+ " is session variable set - message logged in events");
  }
});

Helpers:

As I keep changing the drop down, console log below also keeps changing, this is again a good sign since my session variable is reachable within the helper.

Template.defaultTemplate.schemaNames({
   schemaNames: function () {
               console.log(Session.get("selectedSchema")+ " is session variable - message logged in defaultTemplate:schemaNames");
       return Defaults.find({},{schemaName:1}).map(function(c) {return {schemaName : c.schemaName};
       });
   },

However, for this below function, the console log doesn't print anything at all! meaning that control never gets to this point, even though all of this is in the same helper class.

schemaLabels: function() {
       var selectedSchema = Session.get("schemaName");
       console.log(Session.get("schemaName") +"is the selectedSchema - message logged in defaultTemplate:schemaLabels");
       return Defaults.find({schemaName:selectedSchema},{_id:0,schemaName:0}).map(function(c) {return {label : c.label, value: c.value};});

   }
});

UPDATE:

Upon further tinkering, I noticed that the session variable is called from within schemaLabels helper function only once at the very beginning. It's set to undefined. After that, call to this is never made. So no matter what dropdown I select, the table does not populate anything.


Solution

  • I don't understand why you think that schemaLabels helper should be call. You are using two different Session variables (selectedSchema and schemaName), so these helpers are separated.

    So if you want that everytime you change selectedSchema(Session), schemaLabels helpers called, you have to modify schemaLabels like this:

    schemaLabels: function() {
           var foo = Session.get("selectedSchema"); 
           var selectedSchema = Session.get("schemaName");
           console.log(Session.get("schemaName") +"is the selectedSchema - message logged in defaultTemplate:schemaLabels");
           return Defaults.find({schemaName:selectedSchema},{_id:0,schemaName:0}).map(function(c) {return {label : c.label, value: c.value};});
    
       }