2016-11-21 2 views
1

현재 저자가 아닌 코드로 작업했으며 사용자가 매우 구체적인 문제를 발견했습니다. 전혀 답변을 찾을 수 없었습니다. .날짜 범위 선택기 (부트 스트랩 용 JavaScript 구성 요소) 특정 날짜에 잘못된 날짜를 선택합니다.

페이지에서 Date Range Picker 구성 요소를 사용하여 두 날짜 (시작 및 끝)를 선택합니다.

누군가가 하루에 16/10/2016을 구체적으로 클릭 할 때마다 자동으로 17/10/2016으로 이동합니다.

이것은 여러 컴퓨터와 브라우저에서 아무런 영향을받지 않았으므로 디버거에서 문제를 추적하지 못했습니다.

다른 어느 날, 어느 한 해의 어떤 연도에도 전혀 문제가 없습니다. 하루가 16/10/2016 일 때만 발생하며 해당 날짜가 종료 날짜 인 경우에만 문제없이 시작 날짜가 될 수 있습니다.

현재 버전 :

<section class="col-md-4"> <!-- Selecionar Datas--> 
    <div class="form-group has-feedback has-feedback-right"> 
     <input type="hidden" id="dt_inicio_afastamento"> 
     <input type="hidden" id="dt_fim_afastamento"> 
     <label class="control-label">Escolha o intervalo de datas</label> 
     <i class="form-control-feedback glyphicon glyphicon-calendar"></i> 
     <input id="escolhe_data" name="escolhe_data" class="input-mini form-control" type="text"> 
    </div> 
</section> 

그리고 스크립트 : 여기 2.1.24

는 사용 된 코드입니다 내가 할 수 있었다 chiliNUT에 의해 게시 된 링크를 기반으로

$('input[name="escolhe_data"]').daterangepicker({ 
     showDropdowns: true, 
     autoApply: true, 
     autoUpdateInput: true, 
     locale: { 
      "format": "DD/MM/YYYY", 
      "separator": " - ", 
      "applyLabel": "Aplicar", 
      "cancelLabel": "Cancelar", 
      "fromLabel": "De", 
      "toLabel": "Até", 
      "customRangeLabel": "Outro", 
      "weekLabel": "S", 
      "daysOfWeek": ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sab"], 
      "monthNames": ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro" ], 
      "firstDay": 1 
     }, 
     alwaysShowCalendars: true 
    }, 
    function(start, end, label) { 
     //console.log($('#escolhe_data').data()); 

    }); 

    $('#escolhe_data').on('apply.daterangepicker', function(ev, picker) { 
     $('#dt_inicio_afastamento').val(picker.startDate.format('YYYY-MM-DD')); 
     $('#dt_fim_afastamento').val(picker.endDate.format('YYYY-MM-DD')); 
    }); 
+0

귀하의 마지막 입력 닫는 입력 문이 안된다. 그게 한 가지. –

+0

사실, 고마워요, norcal, 그 코드의 동작을 변경하지 않는 고마워요. –

+0

아니,하지만 그것은 나에게 섰다. jsfiddle를 제공 ​​할 수 있습니까? –

답변

2

문제를 정확하게 지적하십시오. 일광 절약 시간 종료와 관련이 있습니다. 사용자가 시간을 선택하도록하면 문제가 해결됩니다. 이 설정은 $().daterangepicker({ }) 구성에서 "timePicker": true 옵션을 사용하여 수행 할 수 있습니다.

감사합니다.

+0

다행이었습니다. –

+1

다행히 내 링크가 도움이되었습니다! 자바 스크립트에서 날짜가 나를 위해 직장에서 성가신의 항상 존재하는 소스입니다 :) – chiliNUT

1

이 경우에 도움이 될 것이지만 도움이 될 것입니다. 그러나 나는 OP 대답을 +1했습니다.

다음은 추가 할 수있는 몇 가지 다른 기능입니다. 자동 업데이트를 사용하지 않으며 시간대가 잘못 설정 되더라도 영향을 미치지 않습니다.

$(function() { 
    $('input[name="escolhe_data"]').daterangepicker({ 
     timePicker: true, 
     timePickerIncrement: 30, 
     locale: { 
      format: 'MM/DD/YYYY h:mm A' 
     }, 
     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')] 
     } 
    }); 

    $(window).scroll(function() { 
     if ($('input[name="daterange"]').length) { 
      $('input[name="daterange"]').daterangepicker("close"); 
     } 
    }); 
}); 

DEMO : https://jsfiddle.net/norcaljohnny/kensoubf/

관련 문제