Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Не срабатывает datepicker (https://javascript.ru/forum/jquery/35457-ne-srabatyvaet-datepicker.html)

Зосимов 11.02.2013 14:12

Не срабатывает datepicker
 
всем привет.
у меня следующая проблема -
$('#more').click(function(){
     
$('#form-inner').filter(':first').clone().appendTo('.frm');   
  
    });


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

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

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

tsigel 11.02.2013 14:20

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

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

Зосимов 13.02.2013 10:11

мм
я пробовал так
$('#more').click(function(){
$('#form-inner').filter(':first').clone().appendTo('.frm');  
$( ".datepicker" ).datepicker();
    });


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

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

tsigel 13.02.2013 11:52

когда вы пишете:
$('блаблабла').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 будут выполнять свои действия дважды, трижды ... в зависимости от количества переназначений.

Зосимов 13.02.2013 13:37

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

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

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


пробовал так

tsigel 13.02.2013 13:58

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

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

Цитата:

Сообщение от tsigel
$('#form-inner').filter(':first').clone().appendTo('.frm');
$('.frm').find('.datepicker').last().click(function() {alert(1)})

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

Зосимов 13.02.2013 14:25

консоль ошибок не выдает.
при вашем коде выдает 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 работает только на уже существующие поле, а на добавленные нет.

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

tsigel 13.02.2013 14:31

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

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

Зосимов 13.02.2013 14:40

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

tsigel 13.02.2013 14:51

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


Часовой пояс GMT +3, время: 22:38.