Question

经过大量研究，我找不到与我和我使用的插件有关的问题。

我正在尝试克隆DateRangePicker，但没有这样做。我正在更改克隆div的id，然后使用新设置的id初始化datepickerrange。

下面是我尝试的操作，其中我只能更改一次克隆字段的日期，然后在尝试更改日期时它不再响应。

请让我知道是否需要更多信息。

注意：带有类副本的div是他们的，但我没有在这里粘贴它。

<div class="modal-body aaa" id="myList">
     <div class="input-group after_add_more control-group">
          <span class="form-control" id="reportrange">
              <i class="fa fa-calendar"></i>&nbsp;
              <span></span> <i class="fa fa-caret-down"></i>
          </span>
          <div class="input-group-append">
             <button class="btn btn-success" onClick="cloneElement('copy', this)" type="button"><i
             class="fa fa-plus-square"></i></button>
         </div>
     </div>
</div>


<script>
var start = moment().subtract(29, 'days');
var end = moment();
var options = {
    startDate: start,
    endDate: end,
    ranges: {
        'Today': [moment(), moment()],
        'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
        'Last 7 Days': [moment().subtract(6, 'days'), moment()],
        'Last 30 Days': [moment().subtract(29, 'days'), moment()],
        'This Month': [moment().startOf('month'), moment().endOf('month')],
        'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf(
            'month')]
    }
}
var count = 1;
function cloneElement(clone, element) {
    count++;
    $("." + clone).find('.reportrange').attr("id", count);
    var html = $("." + clone).html();
    $('#myList').append(html);
    $('#' + count).daterangepicker(options, cb);
    cb(start, end);
    function cb(start, end) {
        $('#' + count + ' span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
    }
}
</script>

已更新：

<!-- Copy Fields -->
<div class="copy d-none">
<div class="input-group control-group mt-4">
    <span class="form-control reportrange" id="reportrange">
        <i class="fa fa-calendar"></i>&nbsp;
        <span></span> <i class="fa fa-caret-down"></i>
    </span>
    <div class="input-group-append">
        <button class="btn btn-danger" onClick="removeElement(this)" type="button"><i class="fa fa-trash-o"></i>
        </button>
    </div>
</div>

克隆日期范围选择器

0 个答案: