Search code examples
javascriptjqueryhtmlpikaday

Why can't I reuse my Pikaday calendar in a separate field?

I'm using Pikaday in my web application and I have 2 input fields where I want to use the same instance of my calendar. 

 var picker = new Pikaday({
        field: $('.datePickerPerDay')[0],
        format: 'MM/DD/YYYY',
        minDate: moment().toDate()
    });

This is how I define my calendar. Then. I give both input fields the class "datePickerPerDay". But it only works for one of the inputs and not the other. Why is this happening? is it possible to use it like I want?

Solution

  • Just loop over the .datePickerPerDay elements and create a new Pikaday instance for each of them:

    $('.datePickerPerDay').each(function() {
  var picker = new Pikaday({
    field: this,
    format: 'MM/DD/YYYY',
    minDate: moment().toDate()
  });
});