日期选择器不工作

Question

我试图在表中使用日期选取器添加和删除行。默认情况下，日期选取器不起作用。但是我点击了添加行按钮，它已经工作了。我找不到解决方案。

请参考小提琴位置。

<http://jsfiddle.net/MJGV2/>

Answer 1

您必须在DOM上启用datepicker，

你可以做这样的事情。

小提琴

 $("input[type='button'].AddRow").live('click',
 function() {
var index = $(this).closest('tr').index();
if (index > 0) {
    $(this).closest('tr').remove();

} else {


    var $tr = $(this).closest('tr').clone(true);
    var $input = $tr.find('input.startdatum');
    var index = $('input#counter').val();
     $('#test').val('Delete');
    var id = 'datepicker' + index;
    index++;

    $('input#counter').val(index);
    $input.attr('id', id).data('index', index);
    console.log(index);
    $tr.prependTo($(this).closest('table'));
    enable_dp();

}

 });
enable_dp();
function enable_dp()
 {

  $('.startdatum').each(function() {
        $(this).datepicker('destroy');
        $(this).datepicker({
            dateFormat: 'mm-dd-yy'
        });
    });
 }

Answer 2

你的日期选择器在第一次上不起作用，因为你没有在第一时间灌输日期选择器

这是新的小提琴..http://jsfiddle.net/MJGV2/2/

// intilize datepicker at document ready or load..
$(document).ready(function(){

        setdatepicker();

});

$("input[type='button'].AddRow").live('click',
function() {
    var index = $(this).closest('tr').index();
    if (index > 0) {
        $(this).closest('tr').remove();

    } else {


        var $tr = $(this).closest('tr').clone(true);
        var $input = $tr.find('input.startdatum');
        var index = $('input#counter').val();
         $('#test').val('Delete');
        var id = 'datepicker' + index;
        index++;

        $('input#counter').val(index);
        $input.attr('id', id).data('index', index);
        console.log(index);
        $tr.prependTo($(this).closest('table'));
      setdatepicker();

    }

});


function setdatepicker(){

  $('.startdatum').each(function() {
            $(this).datepicker('destroy');
            $(this).datepicker({
                dateFormat: 'mm-dd-yy'
            });
        });
}