CODEWITHSUNDEEP
javascriptjquerydatepicker
rayhan
rayhan

Reputation: 656

How to clone jQuery Datepicker input field

I need to clone a jQuery datepicker input field attached a datePicker to it using the on statement.

$('form').on('click', '.datepicker', function(){
         $(this).datepicker({'changeMonth': true, 'changeYear': true, 'dateFormat': 'MM dd', 'yearRange': "<?php echo date('Y') ?>:<?php echo date('Y') + 1 ?>"}).focus();
    });

Then before cloning the input filed, I am destroying the datepicker using

$(".datepicker").datepicker('destroy').removeClass('hasDatepicker');

But still the datepicker that is being attached to then newly cloned input is messing with original input field...

Can anybody please help me on this topic?

Upvotes: 0

Views: 6531

Answers (2)

Vishal
Vishal

Reputation: 256

try this

var $clone=$(".datepicker").clone();
$clone.datepicker("destroy");
$clone.removeAttr("id");
$clone.datepicker();
$('form').append($clone);

when you clone a row it copies every thing, and when the date picker is added again it calls the input by id, you must remove the id so that the next datepicker can assign a new id to the input :)

Upvotes: 5

Rohan Kumar
Rohan Kumar

Reputation: 40639

You should destroy the datepicker for the clone element like,

var $clone=$(".datepicker").clone();
$clone.datepicker('destroy').removeClass('hasDatepicker');
$('form').append($clone);

Upvotes: 1

Related Questions