datepickerはスクリプト内のテキストボックスで使用されます

Question

スクリプトの外側のテキストボックスに日付ピッカーを使用すると、うまく動作します。

<input type="text" id="entry_date" name="entry_date[]" class="form-control datepicker" data-date-format="<?= config_item('date_picker_format'); ?>" value=""/> 

しかし、私はそれが動作していないスクリプト内に同じ日付ピッカー機能を使用して、方法I gave.Hereが私のコードが何であるかを私はそれがこのように動作するかどうかわからないとき

<script type="text/javascript"> 
$(document).ready(function() { 
$(function() {  
     $("#datepicker1").datepicker(); 
    }); 

var maxField = 10; //Input fields increment limitation 
var addButton = $('.add_button'); //Add button selector 
var wrapper = $('.field_wrapper'); //Input field wrapper 
var fieldHTML = '<div class="form-group"><input class="form-control date_pick datepicker col-lg-2" id="datepicker1" placeholder="yyyy-mm-dd" type="text" name="entry_date[]" value=""/></div>'; //New input field html 


var x = 1; //Initial field counter is 1 
$(addButton).click(function(){ //Once add button is clicked 
    if(x < maxField){ //Check maximum number of input fields 
     x++; //Increment field counter 
     $(wrapper).append(fieldHTML); // Add field html 
    } 
}); 

}); 
</script> 

缶あなたはこの日のピッカーと呼ぶべきだと私に説明してください。

が正しく追加さ

Answer 1

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.min.js"></script> 
 

 
<button class="add_button">Add</button> 
 
\t <div class="field_wrapper"></div> 
 
\t <script type="text/javascript"> 
 
\t \t $(document).ready(function() { 
 
\t \t \t var maxField = 10; //Input fields increment limitation 
 
\t \t \t var addButton = $('.add_button'); //Add button selector 
 
\t \t \t var wrapper = $('.field_wrapper'); //Input field wrapper 
 
\t \t \t var fieldHTML = ''; //New input field html 
 
\t \t \t var x = 1; //Initial field counter is 1 
 

 
\t \t \t $(addButton).click(function(){ //Once add button is clicked 
 
\t \t \t  if(x < maxField){ //Check maximum number of input fields 
 
\t \t \t   x++; //Increment field counter 
 
\t \t \t   fieldHTML = '<div class="form-group"><input class="form-control date_pick datepicker col-lg-2" id="datepicker' + x + '" placeholder="yyyy-mm-dd" type="text" name="entry_date[]" value=""/></div>'; 
 
\t \t \t   $(wrapper).append(fieldHTML); // Add field html 
 
\t \t \t   $("#datepicker" + x).datepicker(); 
 
\t \t \t  } 
 
\t \t \t }); 
 
\t \t }); 
 
\t </script>

Answer 2

チェックHTMLありがとうございました場合、または日付ピッカー機能は、作業多分最近追加jqueryのコードを使用して、jqueryのとは別のhtmlコードを置きます。

よろしく、