2017-04-03 10 views
2

問題がある、私がクリックしたときに現在の日付を表示が追加され新しいDatePickerのフィールド「ボタンを追加」私は手動で日付を変更し、追加ボタンをクリックすると、すべてのdatepickerのデフォルト値がリセットされます。がリセットされ

MY CODEは以下の通りです:

<div class="form-group row"> 
    <label for="example-date-input" class="col-2 col-form-label" style="margin-left:28.5%;">DATE</label> 
    <div class="col-10"> 
    <input class="form-control datepicker pick" id="date[]" name="date[]" value="<?php echo $_POST['date'] ?>" style="" type="text" readonly> 
    </div> 
</div> 

<div class="form-group"> 

<div class="col-md-8 col-sm-12 col-24"> 
    <div class="input_fields" style="color:black"> 
     <button class="add_field btn " onclick="incrementValue()" style="">Add More</button> 
     <div> 
     <input type="text" name="mytextt[]" hidden="" ></div> 
</div> 
</div> 
</div> 

のjavascript: IDに数か何かの変数を取り付けることにより、各フィールド(入力ボックス)の一意のIDを作成するあなたの条件のためにそう

$(document).ready(function() { 
var max_fields  = 10; //maximum input boxes allowed 
var wrapper   = $(".input_fields"); //Fields wrapper 
var add_button  = $(".add_field"); //Add button ID 
var wrapper_pre1   = $(".present_fields_1"); //Fields wrapper 
var x = 1; //initlal text box count 
$(add_button).click(function(e){ //on add input button click 
    e.preventDefault(); 

    if(x < max_fields){ //max input box allowed 
     x++; //text box increment 
$(wrapper).prepend('<div class="form-group row"><label for="example-date-input" class="col-2 col-form-label date">DATE</label><div class="col-10 col"><input class="form-control datepicker pick" id="date[]" name="date[]" style="" type="text"></div></div>');$(".datepicker.pick").datepick({dateFormat: 'dd/mm/yyyy'}).datepick("setDate", "0");}});}); 
+0

あなたは日付をリセットするために、クラス名を使用しているため。したがって、クラス名が '.datepicker.pick'のすべての入力がリセットされます。私はあなたのJQueryに問題があると思います。 '.datepick(" setDate "、" 0 ")'を指定すると、クラス名を使用している間、すべてが設定されます。なぜ '.datepicker.pick' – webDev

+0

私は別のクラス名を指定すべきですか? @webDev – Rice

+0

あなたは、そのIDに基づいて値を追加して追加をクリックすると、入力エリアごとに一意のIDを作成できるはずです。または、クラスを使用して日付を入力領域に設定する場合は、値をリセットしないでください。 – webDev

答えて

1

。クラスを使用していないIDでJSを作成することもできます。他の入力ボックスに影響するようになります。
このような何か、あまりにも

$(wrapper).prepend('<div class="form-group row"><label for="example-date-input" class="col-2 col-form-label date">DATE</label><div class="col-10 col"><input class="form-control datepicker pick" id="date_'+x+'" name="date[]" style="" type="text"></div></div>');$("#date_"+x).datepick({dateFormat: 'dd/mm/yyyy'}).datepick("setDate", "0");}});}); 

ボックス、日付ピッカーメソッドのIDを参照してくださいIDの実装を注意してください。

重要:クラスとIDの使用の違いを見てください。

Difference between class and ID

JQuery Selectors-w3school

How do I select an item using class or ID?

関連する問題