How to set checkbox checked attribute from reactive data source for rendering

I have several checkboxes whose verified attributes are boolean values ​​in the collection. My code correctly tracks the click event on the flags and updates the values ​​in the collection. However, when the page loads first, and when the user navigates from the page, the verified attribute is not set properly, despite the correct session and collection values.

html

<input type="checkbox" id="feedEmailSubscribe" checked={{isChecked}}>

JS helper

Template.layout.isChecked = function () {
  var id = $this.id;
  return Session.get(id) ? "checked" : "";
};

First, I pull out the collection and set the session variable for the checkbox through the invites route

// invites
  this.route('invites', {
    path: ':_id/invited-guest/VIP',
    waitOn : function () {
      return Meteor.subscribe('guests', this.params._id);
    },
    data: function () {
      Session.set('guestId', this.params._id)
      return Guests.findOne({_id: this.params._id});
    },
    action : function () {
      var q = Guests.findOne({_id: this.params._id});
      if (this.ready()) {
        Session.set('guestName', q.name);
        Session.set('feedEmailSubscribe', q.feedEmailSubscribe);
        //...I then redirect the user
      }
    },
  });

I can verify that the sessions are established. Here is what I have for the settings route (where the checkbox is checked)

// settings page
  this.route('settings', {
    path: '/settings',
    waitOn : function () {
      return Meteor.subscribe('guests', Session.get('guestId'));
    },
    data: function () {
      return Guests.findOne({_id: Session.get('guestId')});
    },
    action: function () {
    if (this.ready())
        this.render();
    },
    onAfterAction: function() {
      setPageTitle('Settings');
    }
  });

, , . , Blaze , Blaze wiki, -

!

+4
3

  return Session.get(id) ? "checked" : "";

  return Session.get(id) ? "checked" : false;

, html checked="". HTML. , , false, null undefined , Bozhao.

, . Blaze element.checked JavaScript, checked HTML, . HTML JS . Blaze input value, input checked, textarea value option selected.

+4

: , , "" . , .

settings.js

Template.settings.rendered = function () {
  $(":checkbox").each(function(){
    console.log(this.id);
    if (Session.get(this.id, true)) {
      $(this).prop("checked", true);
    }
   });
};
+2

Source: https://habr.com/ru/post/1539061/


All Articles