0
目前正在使用jQuery的克隆和日期選擇器。與我目前的代碼克隆發生完美。在克隆div中，datepicker正在工作，但它不像原來的那樣工作。jquery日期選擇器克隆年和月不工作和默認日期不顯示
當用戶點擊添加更多按鈕，它是完全克隆整個DIV與日期，但如果我從克隆DIV 年份和月份下拉列表中選擇日期文本框不顯示。
當用戶點擊原始度日期中添加更多按鈕時，它顯示當前日期，但在克隆中沒有顯示。
我試圖從我身邊所有possibilites我沒有得到
我曾嘗試加入破壞了日期選擇器仍然沒有工作
這裏是我的jQuery代碼
var i = 1;
$(document).on("click", ".edu_add_button", function() {
var i = $('.cloned-row1').length;
$(".cloned-row1:last").clone(true).insertAfter(".cloned-row1:last").attr({
'id': function(_, id) {
return id + i
},
'name': function(_, name) {
return name + i
}
}).end().find('[id]').val('').attr({
'id': function(_, id) {
return id + i
}
});
$(".cloned-row1:last").find(".school_Name").attr('disabled', true).val('');
$(".cloned-row1:last").find(".degree_Description").attr('disabled', true).val('');
$(".cloned-row1:last").find('.datepicker,.datepicker1').removeClass('hasDatepicker').datepicker();
i++;
return false;
});
$("#txt_Degdat").datepicker({
dateFormat: "mm-dd-yy",
changeMonth: true,
changeYear: true,
yearRange: '1900:2100'
}).on('change', function() {
if ($('#txt_Degdat').valid()) {
$('#txt_Degdat').removeClass('errRed');
}
// triggers the validation test on change
}).datepicker("setDate", "0");
$("#txt_Trsdat").datepicker({
dateFormat: "mm-dd-yy",
changeMonth: true,
changeYear: true,
yearRange: '1900:2100'
}).on('change', function() {
if ($('#txt_Trsdat').valid()) {
$('#txt_Trsdat').removeClass('errRed');
}
// triggers the validation test on change
});
$(document).on('click', ".btn_less1", function() {
var len = $('.cloned-row1').length;
if (len > 1) {
$(this).closest(".btn_less1").parent().parent().parent().remove();
}
});
這裏是HTML代碼
<div class="container-fluid cloned-row1">
<div class="row">
<div class="col-xs-6 col-sm-3 col-md-4 col-lg-3">
<label>School Name</label>
<br/>
<select class="slt_Field txt_schName" name="txt_schName[]">
<option value="">Please Select</option>
<option value="Emirates College of Technology- UAE">COL000001</option>
<option value="Al Khawarizmi International College- UAE">COL000002</option>
<option value="Syscoms College">COL000003</option>
<option value="Abounajm Khanj Pre-Uni Center">COL000004</option>
<option value="Advanced Placement">COL000005</option>
<option value="Al Buraimi College (Uni Clge)">COL000006</option>
<option value="Al-Ain Community College">COL000007</option>
<option value="AMA Computer College">COL000008</option>
<option value="Arab Academy for Bankg and Fin">COL000009</option>
<option value="ARABACDSCITECHMARTIMETRNS">COL000010</option>
<option value="Arapahoe Community College">COL000011</option>
</select>
</div>
<div class="col-xs-6 col-sm-3 col-md-4 col-lg-3">
<br>
<input type="text" class="ipt_Field school_Name" name="school_Name[]" disabled/>
</div>
<div class="col-xs-6 col-sm-3 col-md-4 col-lg-3">
<label><span class="text-error">*</span>High School Avg/CGPA</label>
<br/>
<input type="text" class="ipt_Field ipt_Havg" id="" name="ipt_Havg[]" />
</div>
<div class="col-xs-6 col-sm-3 col-md-4 col-lg-3">
<label><span class="text-error">*</span>Grade Type @</label>
<br/>
<select class="slt_Field ipt_grd" name="ipt_grd[]">
<option value="">Please Select</option>
<option value="n">100</option>
<option value="n1">4</option>
<option value="c">CHAR</option>
</select>
</div>
<input type="text" placeholder="MM/DD/YYYY" class="ipt_Field txt_Degdat" name="txt_Fdob" />
</div>
<button class="btn_less1 btn_right ">Less</button>
<button class="btn_more btn_right edu_add_button">Add More</button>
這裏是編織Link
任何建議，請我在做什麼錯在這裏。
我已經嘗試了所有可能什麼也沒有工作任何想法請
您在日期選擇器使用id作爲選擇。 ID必須是唯一的。將您的標記更改爲類並再試一次。 – andrew
爲什麼你可以嘗試bootstrap blugin ?,它非常簡單，只需下載庫併爲特定ID調用datepicker函數，這就是全部 –
@andrew我試着用id它不起作用 $（「。clone-row1：last」）。find （ '＃txt_Degdat，＃txt_Trsdat'）removeClass（ 'hasDatepicker'）日期選擇器（）。; – Mahadevan