28 апреля 2012

jquery datepicker и динамически создаваемые элементы

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

Это можно решить двумя способами:

  • создать элемент с помощью jquery;
  • скопировать образец (блок с контролами).
Так вот во втором варианте, при создании динамического элемента, который одновременно является jquery контролом (например datepicker) возникает проблема - элемент не принимает нужных свойств (например не становится datepicker-ом). Вроде бы все правильно, код отрабатывает без ошибок, а datepicker так и не появляется.

Недавно пришлось потратить немалое количество времени для решения подобной проблемы. Оказывается ларчик просто открывался: при создании образца и присвоении ему datepicker - контролу присваивается класс hasDatepicker. Далее при повторном присвоении элементу datepicker видимо идет проверка на наличие этого класса и если он есть - то ничего не происходит. Немного непонятна логика создателей плагина, но зато проблема решается довольно просто: 
$(element).removeClass('hasDatepicker');
$(element).datepicker();

1 комментарий:

neyronius комментирует...

Проблема решается использованием live при навешивании события, но это упущение разработчиков библиотеки, конечно.