4

I got Bootstrap datepicker in my form, at first it was working fine but now, after i used jquery .load function to load the form which contained the datepicker element, it wont work/show itself upon first click but when i click outside and click again then gives me this error in console of firebug:

TypeError: date is undefined
[Break On This Error]   

var parts = date.split(format.separator),

and the datepicker appears....

i have used this javascript to hide the datepicker:

$(document).on('click','.datepicker', function() {
  $('.datepicker').datepicker({ format: "yyyy-mm-dd" }).on('changeDate', function (ev) {
    $(this).blur();
    $(this).datepicker('hide');
  });
})
bipen
  • 36,319
  • 9
  • 49
  • 62
Hunain Usman
  • 2,088
  • 5
  • 23
  • 32
  • this may be a helpful link http://stackoverflow.com/questions/2683072/jquery-events-load-ready-unload. Probably it because the DOM may not be ready, at that time of loading and also try loading the date picker separately in a ready function – arjuncc May 07 '13 at 07:44

2 Answers2

5

You need to initialize your datepicker before they click. You probably should use a callback on .load:

$('#formdiv').load('yourform.php', function() {
 $('.datepicker').datepicker({ format: "yyyy-mm-dd" });
});

This way the element exists, and you tell it what to do when they click BEFORE they click.

dave
  • 62,300
  • 5
  • 72
  • 93
1

So maybe you need is this.

https://github.com/eternicode/bootstrap-datepicker/issues/500#issuecomment-34662552

where $('.datepicker') is a selector.

Robin Gomez
  • 323
  • 3
  • 11