克隆日期選擇器輸入工作不

我有一個日期選擇器輸入（jQuery用戶界面），如下克隆日期選擇器輸入工作不

<div class="row more-info-1"> 
<input class="pi-datepicker" type="text"> 
</div> 

<a href="javascript:void(0)" onclick="addMoreDetails(1)">Add More</a>

我需要多次克隆此輸入，所以我的JavaScript是：

$('.pi-datepicker').datepicker({ dateFormat: 'dd-mm-yy' }); 
function addMoreDetails(nit_quotation_id) { 
    $latest_div  = $('.more-info-'+nit_quotation_id+':last'); 

    $latest_div.datepicker('destroy').removeAttr('id') 

    $clone   = $latest_div.clone(false); 

    $latest_div.after($clone); 
    $clone.find('input.pi-datepicker') 
     .removeClass('hasDatepicker') 
     .removeData('datepicker') 
     .unbind() 
     .datepicker({ dateFormat: 'dd-mm-yy' }); 
}

但是，當我點擊克隆的輸入，出現日期選擇器屏幕，但在第一個輸入框中更改了值。請檢查FIDDLE

來源

2017-09-20 Nitish

這是因爲您的輸入控件具有相同的ID（dd_date）。每次點擊下面的「添加更多」時，請更新您的輸入控件ID。

$clone.find('input.pi-datepicker') 
    .removeClass('hasDatepicker') 
    .removeData('datepicker') 
    .attr('id', 'dd_date' + Math.random()) //newly added line 
    .unbind() 
    .datepicker({ dateFormat: 'dd-mm-yy' });

Updated Fiddle DEMO

來源

2017-09-20 10:38:09

克隆日期選擇器輸入工作不

回答

相關問題