Photoshop Question posted in
The official user guide can be found here.

jQuery inside each loop meteor not works – Photoshop

i everyone,

i have a problem that has already happened to me in another case, but I present this hoping that we can solve it:

The jquery (called on “rendered”) works well when it is not generated by eachloop … why not work in generated html?

i click on an image generated by eachloop and nothing happens

gallery.html

    {{#each gallery}}
        <div class="superbox-list">
            <img src="images/superbox/superbox-thumb-1.jpg" data-img="images/superbox/superbox-full-1.jpg" alt="My first photoshop layer mask on a high end PSD template theme" title="Miller Cine" class="superbox-img">
        </div>
    {{/each}}
        <div class="superbox-list">
            <img src="images/superbox/superbox-thumb-1.jpg" data-img="images/superbox/superbox-full-1.jpg" alt="My first photoshop layer mask on a high end PSD template theme" title="Miller Cine" class="superbox-img">
        </div>
        <div class="superbox-list">
            <img src="images/superbox/superbox-thumb-2.jpg" data-img="images/superbox/superbox-full-2.jpg" alt="My first photoshop layer mask on a high end PSD template theme" title="Bridge of Edgen" class="superbox-img">
        </div>

gallery.js

Template.gallery.rendered = function(){
    $('.superbox').SuperBox();
}

Template.gallery.helpers({
    gallery: function(){
        return Gallery.find();
    }
});

Example,
Image 1 Image 2

best regards,
ty

EDIT:

I used this way and it worked, although not find the method defer in meteor docs!

_.defer(function () {
  $('.superbox').SuperBox();
});
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I used this way and it worked, although not find the method defer in meteor docs!

    _.defer(function () {
  $('.superbox').SuperBox();
});

  2. 0

    Your issue is probably that the data isn’t there when your gallery is first rendered. You can fix that by waiting on the subscription using iron-router’s waitOn (if you’re using iron-router) but that only solves the problem of the documents that are in the database on page load. Any new documents wouldn’t be “superBox’d” either. So the way around that is to have a specific template for each Gallery row.
    Your each becomes:

    {{#each gallery}}
    {{> galley_row }}
{{/each}}

    You add a new template:

    <template name="gallery_row">
    <div class="superbox-list">
        <img src="images/superbox/superbox-thumb-1.jpg" data-img="images/superbox/superbox-full-1.jpg" alt="My first photoshop layer mask on a high end PSD template theme" title="Miller Cine" class="superbox-img">
    </div>
</template>

    Then whenever your new template is rendered (each iteration of the #each loop):

    Template.galley_row.rendered = function () {
    $('.superbox').SuperBox();
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search