Datepicker JavaScriptのJQueryで生成されたフィールド

Question

私は動的に生成されたフィールドに日付ピッカーを追加しています。

('#addScnt1').live('click', function() { 
$('<p class="textocampodetexto" style="margin-left:20px; margin-top:20px;"> 
<label for="p_scnts1"> <input id="au_fechainicioperiodo2" 
name="au_fechainicioperiodo2" type="text" size="7" 
value="" /> </p>').appendTo(scntDiv); 

[フィールドの追加]ボタンをクリックすると、これらのフィールドが追加されます。

生成されたフィールドをクリックすると、日付選択ツールが表示されません。私はjavascriptコードの外にコードを置くので、datepickerが動作していることを知って、それは動作します。

どうすればいいですか？

Answer 1

入力フィールドにdatepickerを再接続する必要があります。 Why does jQuery UI's datepicker break with a dynamic DOM?

コードがあなたと同じではありませんが、あなたのセレクタからの入力フィールドを抽出することができれば、あなたがそれを行うことができます：

はこちらをご覧ソリューションをお試しください。

Answer 2

$('#addScnt1').live('click', function() { 
    var newElement = $('all your html'); //then append it wherever 

    newElement.find('.input-selector').datepicker(); 
}); 

Answer 3

あなたのコードは次のように動作するはずです（LIVE DEMO）：

$(function() 
{ 
    $('#addScnt1').click(function() { 

    $('<p class="textocampodetexto" style="margin-left:20px; margin-top:20px;"><label for="p_scnts1"> <input id="au_fechainicioperiodo2" name="au_fechainicioperiodo2" type="text" size="7" value="" /> </p>').appendTo(scntDiv); 
    $('#au_fechainicioperiodo2').datepicker(
    { 
     showOn: "both", 
     dateFormat: "dd M yy", 
     firstDay: 1, 
     changeFirstDay: false 
    }); 
    }); 
}); 

：