rajit / bootstrap3-datepicker Goto Github PK

According to the documentation i have added
< div class="controls">
< input type="text" class="form-control" id="date_from" name="date_from">
< /div>
in the template 'addNotice' and in js

Template.addNotice.rendered = function() {
$('#date_from').datepicker();
}

The calender is displayed, but

1. When Clicked on previous month arrow '<<' only one month is shown, similarly for the next month '>>'
2. When date is selected, the date's color changes to blue, but when try selecting another date the previous date is still blue and new date doesn't get any background color
3. After selecting the date the calender doesn't hide, even clicking on any other place on the web.

I am using your package with react. Here is the code:
<input type="text" valueLink={this.dateValueLink('date-0')} className="form-control tripDatePicker" placeholder="Select Date"/>

I am initiating datepicker in componentDidMount
componentDidMount: function () { $('.tripDatePicker').datepicker({ startDate: "today", autoclose: true, format: "dd/mm/yyyy" }); },

Datepicker comes properly and when I select a date, it shows up in input field. But my valuelink's requestChange function does not fire.
I know there is option of using event like .on('changeDate'), but it will make things very difficult for me.

Is there anyway by which I can use valuelink with this datepicker?

when I do meteor add rajit/bootstrap3-datepicker then run meteor build, my resulting gz file increases from 19MB to 52MB.
when I do meteor remove rajit/bootstrap3-datepicker then run meteor build again, my resulting gz file falls back to 19MB.

Everything seems to work, except for the large change in the gz package it creates.

Any ideas why this is happening? I am building for Meteor 1.3.4.1

Thanks

Using bootstrap3-datepicker-fr

Doing either

$('#datepicker-test').datepicker({
    language: 'fr'
  });

or via Template.mytemplate.rendered=function()

the months in the datepicker are in English not in French

I am trying to add datepicker to a form, but every time I run the code I get the message:

Uncaught TypeError: Cannot read property 'dates' of undefined.

The error is linked to bootstrap-datepicker-en-CA.min.js, which I added as a cdn at the top of my html file. I've tried adding both dropdowns.less and sprites.less, but that does not seem to resolve my problem. None of the existing threads about this issue seem to help, although I am pretty new to this arena.

Are there any other dependencies or downloads that I need in order for this to run properly? Can I do everything through cdns, or am I missing an important step somewhere? Do I need to download the class 'dates' somewhere?

Thanks

Hi,
Thanks for your package. Do you plan any update ? It would be great !

Hi Rajit,

when I do so with multidates:true

$('[name=datePick]').datepicker('setDates', dates.split(','));

I receive this incorrect result (only one date is marked by blue square):

Thank you for your support!!!

HI Rajiv :
I am using the Persian translation : I do see days of the week listed in farsi, but not the day numbers.
I looked at the local file for farsi . and it is missing numbers. I have listed their translation bellow. How can we add these to the local file ? Thanks

Template.form_enter_product.rendered=function() {
$('#created-datepicker').datepicker({language: 'fa' } );
};

0 = ۰
1 = ۱
2 = ۲
3 = ۳
4 = ۴
5 = ۵
6 = ۶
7 = ۷
8 = ۸
9 = ۹
10 = ۱۰
11 = ۱۱
12 = ۱۲
13 = ۱۳
14 = ۱۴
15 = ۱۵
16 = ۱۶
17 = ۱۷
18 = ۱۸
19 = ۱۹
20 = ۲۰
21 = ۲۱
22 = ۲۲
23 = ۲۳
24 = ۲۴
25 = ۲۵
26 = ۲۶
27 = ۲۷
28 = ۲۸
29 = ۲۹
30 = ۳۰
31 = ۳۱

Hello!
bootstrap-datepicker.fi.min.js file is not updated to 1.5.1 version. It should be repacked.

I am getting this error message randomly.

I can't figure out why it happens some times and why it does't most of the other times.

It happens when I remove and then re-initiate date picker with other language like this:

$('#DatePickerId').datepicker('remove');
InitiateDatePicker(currentLang);

InitiateDatePicker = function(lang){
    $('#DatePickerId').datepicker({
        format: DatePickerLangFormat(lang),
        startView: 0,
        todayBtn: "linked",
        language: lang,
        startDate: moment().format(MomentI18nFormat(lang)),
        endDate: InTwoYears(),
  });
};

Is it an async issue? How can I make sure error never happens?

Can't make it work. Does this package comes with any language other than "en"?

How to add it on Meteor? Tried the $.fn.datepicker.dates['en'] suggested at eternicode/bootstrap-datepicker i18n doc page, but the app crashes.

Any ideas?

I have the following date-range HTML that I wrote based on examples from eternicode.

HTML:

 <div class="col-sm-3">
    <div class="input-daterange input-group" id="DatePickerId">
      <input type="text" class="input-sm form-control" data-provide="datepicker"  name="start" placeholder="{{_ 'Check-in'}}" id="startdate"/>
      <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
      </span>
      <input type="text" class="input-sm form-control" data-provide="datepicker" name="end" placeholder="{{_ 'Check-out'}}" id="enddate"/>
      <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
      </span>
    </div>
</div>

and JS:

Template.Form.events({
        'click #DatePickerId': function(e){
          e.preventDefault();
            $('#DatePickerId').datepicker({
                format: 'DD, dd-mm-yyyy',
                startView: 0,
                todayBtn: "linked",
                language: "pt-BR",
                startDate: today(),
                endDate: InTwoYears()
             })
        },
});

However both "format" and "todayBtn" have been applied to only one of the date fields as shown:

What am I doing wrong?

is it also made for bootstrap 4?

i tried implementing it inside, but nothing happens.
are there some tweaks to be done?

thanks

I'm trying to achieve the startView with milleniums for birth dates, but the option just does not work with any of the possible values. Also tried other options for startView, but the option of startView just seems to be broken.

Template.Profile.onRendered( function(){
    $(document).ready(function () {
        $("#birthdateField").datepicker({
            autoclose: true,
            orientation: "bottom",
            startView: 4
        });
    });
});

Hi, thanks for maintaining this wrapper! I've run into a bug that was fixed in 1.5.1 upstream (uxsolutions/bootstrap-datepicker#1628). Any chance we could get an update?

Hope there's a defaultDate set in the option parameters, its for setting the initial/default date. Or is there another way to do this?

Hi,

may you, pls, help we to set up the use of multidate:true within autoform?

I'm constantly getting only one date saved. Here is my code:

template:
{{> afQuickField name="notAvailableDates" buttonClasses="glyphicon glyphicon-calendar" datePickerOptions=dateOptions}}

helper:
dateOptions: function () { return {multidate: true, todayBtn: "linked", todayHighlight: true} }

schema:
notAvailableDates: { type: String, optional:true, autoform: { afFieldInput: { type: "bootstrap-datepicker" } }, }

what's wrong?

Thank you.

Its not working in modal..

I have it also in Stackoverflow:
Month, Year Switch causes datepicker to freeze

Any Ideas? Thanks!

I'm using this meteor package, with the below code. I can select a date for January which works as expected - date set in input form and the date picker closes, but if I choose a date before or after January, the date picker displays only one month forwards or backwards (February or November) then the package locks up and does not display months forward or backwards and it will not autoclose. I searched stack overflow for solutions, but could not find one. Thoughts?

template:
<div class="form-group"> <label id="dueDate" class="col-sm-3 control-label" for="dueDate">Due Date</label> <div class="col-sm-9"> <input class="form-control" data-provide="datepicker" id="datepicker" name="dueDate" type="text" value="" placeholder="Choose Due Date"> </div> </div>

JS file:
$('#datepicker').datepicker({ format: "mm-dd-yy", autoclose: true });

Hi,

I hav a bug, my change date event fires 3 times. I look on google, and apparently, this bug was fixed.
Could you update your package/bootstrap.js core ?

Creatively, maxime

Using bootstrap3-datepicker-fr

Doing either

$('#datepicker-test').datepicker({
    language: 'fr'
  });

in the console or calling via Template.mytemplate.rendered=function()

• Datepicker pops up OK.
• Month is September 2015.
• I can click to October 2015
• I cannot click to December 2015
• I cannot click back to September 2015

If I try to go the other way after the datepicker pops up I get stuck on August.

With tracker depends maybe you could implement i18n rerendering since that rerenders template.

Getting the following error using the bootstrap3-datepicker-fr package

Uncaught TypeError: Cannot read property 'dates' of undefined(anonymous function) 
@ bootstrap-datepicker.fr.min.js:1(anonymous function) 
@ bootstrap-datepicker.fr.min.js:1(anonymous function) 
@ rajit_bootstrap3-datepicker-fr.js?39f3534c69768438ad0eddf23a5133507f1892d4:36(anonymous function) 
@ rajit_bootstrap3-datepicker-fr.js?39f3534c69768438ad0eddf23a5133507f1892d4:43

Example: