Jquery Clone Date Picker Not Working

Working on clone using datepicker. I have searched in stackoverflow for my issue i am not getting the correct stuff. When the user clicks the date from the original date it was wo

Solution 1:

Jquery datepicker creates UUID-based ID attributes for the input fields it binds when you initialize it. You cloning those elements results in more elements with either the same ID (which jQuery does not like) or a different ID if your clone routine manages that (which means datepicker does not know about the clones).

try updating your js code like this

$clone.find("input.deg_date")
    .removeClass('hasDatepicker')
    .removeData('datepicker')
    .unbind()
    .datepicker({
        dateFormat: "mm-dd-yy",
        changeMonth: true,
        yearRange: "-100:+0",
        changeYear: true,
        maxDate: newDate(),
        showButtonPanel: false,
        beforeShow: function() {
            setTimeout(function() {
                $('.ui-datepicker').css('z-index', 99999999999999);

            }, 0);
        }
    });

here's the updated JSFIDDLE. hope this helps.

Solution 2:

You can re-initiate datepicker,

Put datepicker line at last on click event

$(document).on("click", ".edu_add_button", function () { 
  ...
  ...
  ...
  ...
  $(".deg_date").datepicker("setDate", currentDate);
});

It will work!!!