активировать средство выбора даты в динамически клонированных полях - PullRequest
Новая
       7

активировать средство выбора даты в динамически клонированных полях

0 голосов
/ 25 июня 2018

Я клонирую набор полей, одним из которых является поле datepicker.

Я вижу это Используйте JQuery Datepicker для динамически создаваемых полей и этот jqueryDatePicker для клонированных элементов , и это помещает datepicker () в динамически создаваемые элементы - JQuery / JQueryUI , но ни один из них не работает для меня.

HTML: 

<div class="dedicationfields">
  <div class="form-group">
    <div class="col-md-12">
      <div class="col-md-6">
        <label class="datetag"> date: </label>
        <input placeholder="enter date" name="requestedDate"
           value="" size="30" class="required form-control datepicker  " 
           title=" " id="dp1529938300566" type="text">
      </div>
    </div>
  </div>
</div>
<div class="form-group" style="margin-top: 3px;">
  <input name="triggerAdd" id="triggerAdd" class="btn btn-success" value="ADD A NEW SET" type="button">
</div>

JS CODE: 

$("#triggerAdd").click(function(){

    // clone fields:
   var dedicationfields = $(".dedicationfields:first").clone(true).insertAfter(".dedicationfields:last");

    //make sure new fields are empty: 
    $(".dedicationfields:last input[type=text], .dedicationfields:last select").val('');    

    $(".dedicationfields:last .datepicker" ).removeClass('hasDatepicker'); // added the removeClass part.

});

$(document).on('focus',".datepicker", function(){
    $(this).datepicker();
});

Вот ДЕМО: https://jsfiddle.net/kneidels/w12cx7qt/11/

1 Ответ

0 голосов
/ 26 июня 2018

Вы можете попробовать этот код 

    $("#triggerAdd").click(function(){

       var $last   = $('.dedicationfields:last');
       var $clone  = $last.clone(false);
       $last.after($clone);
       $(".dedicationfields:last input[type=text], .dedicationfields:last select").val('');
       $clone.find('input.datepicker')
            .removeClass('hasDatepicker')
            .removeData('datepicker')
            .attr('id', 'change_id' + Math.random())
            .unbind()
            .datepicker();
            });

     $(document).on('focus',".datepicker", function(){
    $(this).datepicker();
});

Вы можете просто настроить атрибут change_id ID по своему вкусу.

jsfiddle

...