У меня проблема. jQuery Datepicker не работает в динамической форме, поэтому вы не можете выбрать дату. Вот моя демонстрационная ссылка http://gestionale.odoyabooks.com/sum.php .
JavaScript:
<script> $(document).ready(function() { $('.input_date').on('click', function() { $(this).datepicker('destroy').datepicker({showOn:'focus'}).focus(); }); }); </script>
HTML:
<form action="" method="POST"> <div class="yes"> <div id="cost1" class="clonedCost" style="display: inline;"> <table border="0"> <tr> <td><label class="date" for="date">Date</label></td> </tr> <tr> <td><input class="input_date" id="date" type="text" name="date[]" /></td> </tr> </table> </div> <div id="addDelButtons_cost"><input type="button" id="btnAdd" value=""> <input type="button" id="btnDel" value=""></div> </div> </form>
Проблема в том, что при первоначальном привязке события новое поле не существует.
Применяя клик к телу с помощью селектора .input_date
, он должен присоединить событие к новому элементу в динамической форме.
$(function() { $('body').on('click','.input_date', function() { $(this).datepicker('destroy').datepicker({showOn:'focus'}).focus(); }); });
Рабочий пример
Вы должны инициализировать datepicker для поля при создании элемента.
$(function() { $('.input_date').datepicker(); }); function createNewDatepickerInput() { var $newInput = $('<input type="text" name="date123" class="input_date" />'); $newInput.appendTo("form").datepicker(); }
Рабочий пример
Я не понимаю, почему вы уничтожаете / повторно инициализируете datepicker. Вам просто нужно вызвать .datepicker () после создания элемента. Например:
function createInput() { $('<input type="text" name="date" />').appendTo("form").datepicker(); }
Редактировать: Вот демо: http://jsfiddle.net/xEmJu/