Como anexar o datePicker da jQuery UI ao campo de formulário dinamicamente inserido?
Eu tenho uma tabela contendo um monte de campos de entrada, como uma planilha. Alguns dos campos de entrada usam o datepicker da UI do jQuery. Há também um botão para adicionar uma linha da tabela.
Quando clico no botão para adicionar uma linha da tabela, ela é adicionada ao DOM corretamente. Mas, o widget datepicker não é anexado aos campos de data nessa nova linha.
Eu suspeito que a resposta é usar live () - ou talvez on () - para chamar datepicker (), mas não entendo qual sintaxe usar. O código abaixo já está empurrando os limites da minha compreensão do jQuery. Minha cabeça dói. Socorro?
<code><script type="text/javascript"> $(function() { $( ".usedatepicker" ).datepicker(); }); $('.rowadd').live('click',function(){ var appendTxt = '<tr><td><input class="usedatepicker" name="something" type="text" /></td></tr>'; $("tr:last").after(appendTxt); }); </script> </code>
Nota 2: Eu tentei isso também, com live () e on (). Parece funcionar tanto nos campos originais quanto nos dinamicamente inseridos, mas esporadicamente (pelo menos no Chrome). Tipo, ele vai funcionar por três segundos e depois parar por três segundos, e então trabalhar por três segundos e ...
<code>$(function() { $('.usedatepicker').live('click', function(){ $(this).datepicker({showOn:'focus'}); }); }); </code>