How could I make this Meteor code reactive?

I have a number of 'multiple' selectors, but for the sake of this example, let's say I have two.

<form class="input-field col s10">   <select multiple id="jans-room21">     <option value="" disabled selected>Add Names</option>     {{#each Jans21}}         <option value= '{{FullName}}' selected = {{formatSelectedNames21 RoomJans}} >{{FullName}}</option>     {{/each}}   </select> </form>  <form class="input-field col s10">   <select multiple id="jans-room22">     <option value="" disabled selected>Add Names</option>     {{#each Jans22}}       <option value='{{FullName}}' selected = {{formatSelectedNames22 RoomJans}}>{{FullName}}</option>     {{/each}}   </select> </form> 

Jans21 and Jans22 are returning a number of documents from the DB. They'll display the selected names for that room, or those that have no 'RoomJans' property or have a 'RoomJans' equal to ''. They will exclude those names that were chosen in the other selector.

Template.jansNameSelect.helpers({    Jans21: function () {      return Programs.find({ $and: [{ CampYear: Session.get('GlobalCurrentCampYear') }, { $or: [{ RoomJans: '' }, { RoomJans: { $exists: 0 }}, { RoomJans: { $in: ['21A', '21B'] }}]}]}, { sort: { FullName: 1 }}).fetch();   },    Jans22: function () {     return Programs.find({ $and: [{ CampYear: Session.get('GlobalCurrentCampYear') }, { $or: [{ RoomJans: '' }, { RoomJans: { $exists: 0 }}, { RoomJans: { $in: ['22A', '22B'] }}]}]}, { sort: { FullName: 1 }}).fetch();   } }); 

When a button is clicked, a method is called to update the DB and store those names.

// ... $('#room_21_jans_button').on('click', function() { var roomValue = $('input[name="room_select_21_jans"]:checked').val(); if (roomValue) {   var selectedValues = [];   $r21jans.find("option:selected").each(function () {     selectedValues.push($(this).val());   });   selectedValues.splice(0, 1);   var unselectedValues = [];   $r21jans.find("option:not(:selected)").each(function () {     unselectedValues.push($(this).val());   });   Meteor.call('roomUpdateSN',     selectedValues,     unselectedValues,     roomValue,     Session.get('GlobalCurrentCampYear')   ); //... 

What I'm after is when names are selected in the first selector, and subsequently saved to the database, the second selector will update its list of names to remove those names that were selected from the first. I had thought that this would be reactive since I am performing a database action, such that the 'Jans22' function would fire again if names were chosen from the first selector and saved to the DB. But it isn't. It will, however, load the right names on a refresh. Is there a way to get this to be reactive?

Replay

Category: meteor Time: 2016-07-29 Views: 0
Tags: meteor blaze

Related post

iOS development

Android development

Python development

JAVA development

Development language

PHP development

Ruby development

search

Front-end development

Database

development tools

Open Platform

Javascript development

.NET development

cloud computing

server

Copyright (C) avrocks.com, All Rights Reserved.

processed in 0.192 (s). 12 q(s)