Meteor.js : add a date picker to a page - meteor

Question

I'm trying hard to get a date picker on my meteor application. I tested lot of packages found by googling, but none seems to work, or, probably, I'm doing it wrong. Can someone tell me clearly how to add a date picker?
Thanks a lot!

Answer 1

I would use the bootstrap 3 package and the bootstrap 3 date time picker package:
$ meteor add twbs:bootstrap
$ meteor add tsega:bootstrap3-datetimepicker
Then, simply add the form in your HTML file:
<template name="myTemplate">
<form>
<div class="form-group">
<label for="myInput">Input name</label>
<div class="input-group datetimepicker">
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
<input name="idInput" id="idInput" class="set-due-date form-control" type="text"/>
</div>
</div>
</form>
</template>
And in your corresponding JavaScript file, you have to initialize your date time picker:
Template.myTemplate.rendered = function(){
$('.datetimepicker').datetimepicker();
};
And if you have different date input in your page (for example):
Template.myTemplate.rendered = function(){
$('.datetimepicker').each(function(){
$(this).datetimepicker();
});
}
Finally, I invite you to read the Documentation if you need more options (like date format etc).
Hope it will help you!

Answer 2

I use the one from eonasdon (Bootstrap required) and you get get it prepackaged by doing this:
meteor add hujhax:bootstrap3-datetimepicker

Answer 3

I have these packages added
twbs:bootstrap
jquery
rajit:bootstrap3-datepicker
and used this in the template
<div class="box-body no-padding">
<!--The calendar -->
<div id="calendar" style="width: 100%"></div>
</div><!-- /.box-body -->
and added helper below
Template.myCalendar.rendered = function() {
$('#calendar').datepicker();
}