Reputation: 487
Is it possible to do something like this:
Template.hello.rendered = function() {
$("#timepicker-default").timepicker();
};
Inside of a package, independent of the actual template name.
Ignoring any other issues with the above pseudocode, what I'm wondering is how can I select DOM elements from within a package. Is it possible to write a package that can find the input element with data-attribute or a class of timepicker and generate the above code inserting the id of that element?
So you could write your markup like
<input id="mytimepicker" type="text" data-timepicker="default">
And the package would handle the rest.
Upvotes: 0
Views: 326
Reputation: 64342
I think the fastest solution is to use the template-extension package. You'll get access to an onRendered
hook which will fire every time any template in your app is rendered.
$ meteor add aldeed:template-extension
Template.onRendered(function () {
this.$('input[data-timepicker]').timepicker();
});
Place the above anywhere in your client
directory and it should select all all inputs in the template being rendered where the data-timepicker
attribute is set.
If you need to use this in a package, just add api.use('aldeed:template-extension');
in your package.js
.
Upvotes: 1