Dynamic bootbox modals in meteor

Question

I'm trying to create a basic app that dynamically renders thumbnails and associates a dynamically generated modal to each on click. I can't seem to figure out how to insert data from my mongo db into the bootbox alert, I know i need to run the query again, but I'm not sure how to retrieve the fields for that specific entry.

Here's the html template:

<template name="gallery">
    <div class="col-xs-6 col-sm-6 col-md-2">
      <a href="#" class="thumbnail" data-toggle="#">
        <img src="{{img}}" alt="...">
          <div class="caption">
            <h5><center>{{name}}</center></h5>
          </div>
      </a>
    </div>
</template>

and here's the js.

Gallerys = new Mongo.Collection("gallerys");

if (Meteor.isClient) {
  // This code only runs on the client
  Template.body.helpers({
    gallerys: function () {
      return Gallerys.find({}, {sort: {createdAt  :-1}});
    }
  });

  Template.body.events({
    "click a.thumbnail": function(e) {
      bootbox.alert(function(){
        return Gallerys.find();
      };
    }
  });
}

Answer 1

Hopefully you'll eventually move the overall gallery into its own template and tie the helper functions to that instead of to body but let's deal with the main issue, your body event handler needs to return the data context of an individual record, not a cursor. The click on the overall gallery should give you the context of an individual gallery item with the result that this will point to that document and this._id will be the _id of that document.

Template.body.events({
  "click a.thumbnail": function(e){
    bootbox.alert(function(){
      return Gallerys.findOne({_id: this._id});
    };
  }
});

I suspect you also want to be using bootbox.dialog and not just bootbox.alert