bootstrap datepicker invalid date issue when i click date twice?

Question

I'm using bootstrap datepicker and I got invalid date issue in a specific case. If I click today date it works fine but when I click the same date again it gives out invalid date issue.

Same is the case for all the dates as I have seen other plugins where I can't find this issue.

html: <input id="dp1" type="text" class="form-control input-sm" placeholder="Data CheckIn">

javascript:

$("#dp1").datepicker({
    format: "mm-dd-yyyy",
    viewMode: 'days',
    todayHighlight: true 
}).on('changeDate', function (ev) {
    var a = $('#dp1').datepicker('getDate');
    $(this).datepicker('hide');
    alert(a);
});

jsfiddle example

Answer 1

var currentDate;
$('#dp1').datepicker({
    format: "mm-dd-yyyy",
    viewMode: 'days',
    todayHighlight: true

    // currently picked date
  }).on('show', function() {
    currentDate = $(this).val();
  })
  // if no date picked replace with previous date
  .on('changeDate', function(ev) {


    if ($(this).val() === '' || $(this).val() === null) {
      $(this).val(currentDate).datepicker('update');
    }
    var a = $('#dp1').datepicker('getDate');
    $(this).datepicker('hide');
    alert(a);

  });

Answer 2

After an effort of a day I solved issue by myself by doing a little change in plugin.

In bootstrap-datepicker.js method _toggle_multidate line no 1024 has been commented.

else if (ix !== -1)
{
    //this.dates.remove(ix);
}

and it will work like a charm. I hope this can help.

Please try and do let me know if this case solve your issue Thanks

Answer 3

you can use delegate, it does work fine

$("body").delegate('.date' ,'focusin', function() {
     $(this).datepicker({
         autoclose: true,
         viewMode: 'days',
         todayHighlight: true
     });
});