Не срабатывает datepicker
 

всем привет.
у меня следующая проблема -

$('#more').click(function(){
     
$('#form-inner').filter(':first').clone().appendTo('.frm');   
  
    });

поясню на всякий - при клике на кнопку я копирую поля формы (есть поля уже готовые, но если надо больше нажимаем кнопку и добавляем).

одно из полей формы имеет class='datepicker'. Так вот при добавлении полей datepicker не срабатывает в добавленных полях.

подскажите плиз почему это происходит?

я так понимаю, что к классу datepicker у вас привязано какое-то событие?

Это событие не срабатывает потому что при назначении обработчиков данного элемента не существует и при добавлении его вам надо переназначить обработчики.

мм
я пробовал так

$('#more').click(function(){
$('#form-inner').filter(':first').clone().appendTo('.frm');  
$( ".datepicker" ).datepicker();
    });

нет?
или подскажите подробнее как переназначить обработчик?

и забыл сказать что к datapicker привязано событие выбора даты jQuery

когда вы пишете:

$('блаблабла').click(функция);

При загрузке страницы и инициализации скриптов скрипт проходит по странице и говорит что все "блаблабла" при клике должны сделать "функция". Так назначаются обработчики.

Чтобы назначить обработчик на новый datepicker вам необходимо:

$('#form-inner').filter(':first').clone().appendTo('.frm').find('.datepicker')./*обработчик*/(/*функция*/);

Например:

$('#form-inner').filter(':first').clone().appendTo('.frm').find('.datepicker').click(function() {alert(1)})

или, что то же самое:

$('#form-inner').filter(':first').clone().appendTo('.frm');
$('.frm').find('.datepicker').last().click(function() {alert(1)})

Работая с объектами jQuery вам надо знать, что эти объекты всегда возвращают объект с которым вы работаете (за исключением тех случаев когда их вывод должен быть задан явно. Т.е. toggleClass() вернет объект к которому он применен, а text() вернет текст)

Обратите внимание, что при назначении обработчика в скобках можно написать название функции, чтобы не повторять уже написанный код.

Очень важно что вам надо переназначить не все обработчики, а только тот элемент которого вы добавили, в противном случае ранее существовавшие datepicker будут выполнять свои действия дважды, трижды ... в зависимости от количества переназначений.

спасибо за подробный ответ.
но у меня никак не получается ((

в скопированных полях так же не работает функция datepicker()

$('#form-inner').filter(':first').clone().appendTo('.frm');
$('.frm').find('.datepicker').last().click(function() {datepicker()});

пробовал так

Почему не работает? Что пишет консоль? Выложите больше кода. Целиком что копируете, куда и саму функцию "datepicker()"

Если при таком варианте по клику выдает 1

значит беда в вашей функции

консоль ошибок не выдает.
при вашем коде выдает 1 в окне алерт. а это разве не правильно?

вообще я пытаюсь скопировать примерно вот что

<form class="frm" action="add.php" method="post">
<div id="form-inner">
     <input class='inp' type='text' name='city' placeholder="город"/>
     <input class='datepicker input-small' name='start_date' type="text" placeholder="дата"  />         
</div>
<input class="btn" name="add_input" type="submit"  value="Сохранить" />
</form> 
 <div class="btn" id="more"> Еще</div>

таким образом, я хочу при нажатии на Еще я хочу добавлять div с парой полей. столько, сколько нужно

$('#more').click(function(){      
$('#form-inner').filter(':first').clone().appendTo('.frm');
$('.frm').find('.datepicker').last().click(function() {datepicker() 
   });
});

при таком варианте как и при моем

$('#more').click(function(){
$('#form-inner').filter(':first').clone().appendTo('.frm'); 
$( ".datepicker" ).datepicker();
    });

datepicker работает только на уже существующие поле, а на добавленные нет.

может я вообще не тот подход выбрал ?

Ну во первых не надо делать на сайте несколько одинаковых id, это не красиво, сделайте классами.

Выложите ещё функцию datepicker(). И при каком событие должна выполняться ваша функция? при фокусе?

функция выполняется при клике на поле инпут
вот такой - http://jqueryui.com/datepicker/

это же плагин, вам надо подключить его так же как вы подключали его при загрузке страницы.

Не ?

$('#more').click(function(){
$('#form-inner').filter(':first').clone().appendTo('.frm'); 
$('.frm').find('.datepicker').last().datepicker();
});

нет. так тоже не работает (

вы имеете ввиду подключать при каждом добавлении элемента?

Зосимов,
Подключать к вновь добавленному элементу

$('#more').click(function(){
$('#form-inner').filter(':first').clone().appendTo('.frm'); 
$( ".datepicker" ).datepicker();
    });

разве тут я не подключаю?
или что имеется ввиду?

Да, эта строчка должна подключить плагин.

Только

$('.frm').find('.datepicker').last().datepicker();

$('#more').click(function(){
$('#form-inner').filter(':first').clone().appendTo('.frm');
$('.frm').find('.datepicker').last().datepicker();
});

так в этом то и проблема - так тоже не работает (

Нуу.. тогда не знаю. Вы все сделали верно, я бы сам написал эту datepicker() (аналог с ограниченным функционалом сделать не очень сложно) и получил возможность управлять ей как мне надо.
Посмотрите в документации плагина может что-то сказано о подключении к динамически создаваемым/подгружаемым элементам

Если ответ всё ещё интересен то он таков:
1. Каждому полю дай другой id, на пример datepicker1.
2. При подключении же скрипта скажи что б скрипт распространялся и на этот id примерно так

<script type="text/javascript">
	$(function() {	
		$( "#datepicker, #datepicker1" ).datepicker({
...