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?
<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>
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 ...
$(function() {
$('.usedatepicker').live('click', function(){
$(this).datepicker({showOn:'focus'});
});
});