jquery Datepicker для строк клонов

Question

jquery Datepicker для строк клонов

Я использую Datepicker, который поставляется с JQuery …

new.php

<html>
<table id="testtable">
<tr id="table_row1">
<td><input type="text" name="date[]" class="pickDate"></td>
<td><?php ...some php stuff here...?> </td>
</tr>
</table>
<label onclick="cloneRow('testtable','table_row1')"></label>
</html>

index.php

<html>
<php
include('new.php')
?>
<script>
$(document).ready(function() {
$('.pickDate').each(function() {
$(this).datepicker({ dateFormat: 'dd.mm.yy' });
});
});
</script>
</html>

функция JavaScript для клонирования:

function cloneRow(tablename,rowname) {
var row = document.getElementById(rowname); // find row to copy
var table = document.getElementById(tablename); // find table to append to
var clone = row.cloneNode(true); // copy children too
clone.id = "newID"; // change id or other attributes/contents
table.appendChild(clone); // add new row to end of table
}

Таким образом, проблема заключается в том, что в первом ряду указатель даты есть и работает, но если я клонирую строку, то у клонированного не будет указателя даты.

Я проверил, клонируется ли класс тоже, и да, это так.

Я очень новичок в jquery, но разве jquery не замечает, что была добавлена новая строка?

Как я могу заставить это работать?

0

datepicker jquery php

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Проблема в том, что код, который применяет плагин, запускается только один раз при загрузке страницы. Вам нужно будет применять плагин каждый раз, когда вы клонируете узел. Кроме того, поскольку у вас уже есть jQuery, я изменил код, чтобы использовать jQuery для управления элементами.

function cloneRow(tablename,rowname) {
var row = $("#" + rowname); // find row to copy
var table = $("#" + tablename); // find table to append to
var clone = row.clone(); // copy children too
clone.attr("id", "newID"); // change id or other attributes/contents
table.append(clone); // add new row to end of table
clone.children(".pickDate").datepicker({ dateFormat: 'dd.mm.yy' });
}

1