1

I have a page, that lists a collection, that can be filtered. As there are some fancy effects (hover dimming) on these items, they have to be applied once the page has loaded.

This works fine, but when I select a criteria that hides an item, and then make it reappear by deleting that filter, these effects are no longer applied to these items.

I have tried to create a template.rendered function, but that only works on the first page load.

I also thought that adding a 'hover #mydiv: function () {...}' inside the template.events section could help, but that still doesn't work.

I have even tried to listen to the changes made in the drop-down ('change #myselect': function () {...}) where the filters can be applied, but that's not working either.

I also tried to tie it to a dependency, that is submitted when the criteria is selected, that has also failed.

Any suggestions what else should I try?

Thanks, Alex

Edit 1:

This is how I treat the filters:

in Template.search.events:

'change #search-skills-select': function () {
    Session.set('searchFilter', $('#search-skills-select').val());
}

This then goes to:

/* This is of course properly handled for nulls, undefineds, etc. */
var searchFilterString = Session.get('searchFilter');

Profiles.find({profileAttributes: {
                    $all: searchFilterString
                 }
             });
Alex Szabo
  • 3,274
  • 2
  • 18
  • 30

1 Answers1

1

You can do this on your child template (the one that appears and disappears):

<template name="mytemplate">
  <div id="my-magic-div">
    .. stuff goes here ..
    {{add_my_special_behavior}}
  </div>
</template>

and then add code:

Template.mytemplate.add_my_special_behavior = function () {
  Meteor.defer(function () {
    // in here, `this` means the template context
  });
};

(inspired on https://stackoverflow.com/a/10119993/5109168)

Community
  • 1
  • 1
franciscod
  • 992
  • 4
  • 17