Search code examples
javascriptnpmbootstrap-timepicker

bootstrap-timepicker : copy/paste dates values in input field


With multiselect option set to true, I want to be able to copy paste values from an input field to another. Actually the paste event is trigering a kind of validation and always displaying the current day on the selection widget.

I've tried to set the forceParse option to false but it doesn't change anything. I've also look on the documentation but can't find an option for this problem, have I missed something ? Should I fork this package and modify the paste event myself ? I've seen a looooot of forks of this package on Github, maybe someone had the same issue ?

https://github.com/uxsolutions/bootstrap-datepicker

Cheers guys and thanks for your help.

$('.date').datepicker({
   multidate: true,
   format: 'yyyy-mm-dd',
   orientation: 'bottom',
   language: 'fr',
   forceParse: false,
});

Solution

  • Workaround using paste event

    Issue https://github.com/uxsolutions/bootstrap-datepicker/issues/1950

    $('input').datepicker({
      multidate: true,
      format: 'yyyy-mm-dd',
      orientation: 'bottom',
      language: 'fr',
      forceParse: false,
    });
    
    $('input').on('paste', function(e) {
      this.value = new String(e.originalEvent.clipboardData.getData('text') || '')
    })
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.standalone.min.css" integrity="sha256-jO7D3fIsAq+jB8Xt3NI5vBf3k4tvtHwzp8ISLQG4UWU=" crossorigin="anonymous" />
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js" integrity="sha256-bqVeqGdJ7h/lYPq6xrPv/YGzMEb6dNxlfiTUHSgRCp8=" crossorigin="anonymous"></script>
    
    <input type="text">