Question

I need to show dynamic date picker ,my code is below

$(function() {
$('.datepicker').datepicker({
    showAnim: "clip",
    gotoCurrent: true,
    dateFormat: "dd-mm-yy"
});
$('#mdcn_name').click(function(){

            $('<tr class="field" id="row"><td><input type="text" id="expire_date" name="expire_date" class="datepicker" placeholder="dd-mm-yyyy"/></td></tr>').fadeIn('slow').appendTo('#dataTabl');


});


});

<table id="dataTabl">
        <tr>
            <th>Exp Date</th>

            </tr>
</table>

When i click add row then i need to create/show datepicker dynamically.
Please help me

Answer 1

That is because your datepicker is not initailize for the dynamically appended div.

create a datepicker function

function displayDatepicker(){
 $('.datepicker').datepicker({
   showAnim: "clip",
   gotoCurrent: true,
   dateFormat: "dd-mm-yy"
 });
}

$(function() {
     displayDatepicker()  //initialize date picker whn doucment is ready

     $('#mdcn_name').click(function(){

        $('<tr class="field" id="row"><td><input type="text" id="expire_date" name="expire_date" class="datepicker" placeholder="dd-mm-yyyy"/></td></tr>').fadeIn('slow').appendTo('#dataTabl');

         displayDatepicker() //call it after the element is appended...now this finds the appended div with a class datepicker and initailze the datepicker...

      });
});