how to update INPUT of daterangepicker

Question

I have this daterangepicker:

           $('#licencia_municipal_emision, #licencia_municipal_vencimiento, #licencia_interna_emision, #licencia_interna_vencimiento').daterangepicker({
                showDropdowns: true,
                singleDatePicker: true,
                autoUpdateInput: false,
                singleClasses: "picker_1", locale: {
                    format: 'DD/MM/YYYY'
                }
            }, function (start, end, label) {
                $(this).val(start.format('DD/MM/YYYY'));
                alert(start.format('DD/MM/YYYY'))
            });

Notice the "autoUpdateInput: false"... this is required so that INPUT controls appear initially empty.

When I click a date, the callback is called, but I cannot update the attached INPUT. How to do it?

Answer 1

Following the instructions on the official guide

your html

<input type="text" name="datefilter" value="" />

your js code will initialize the datepicker but listen for the select event and cancel event in to different calls and not in the initialization

$('input[name="datefilter"]').daterangepicker({
      autoUpdateInput: false,

    singleDatePicker:true
  });

  $('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
      $(this).val(picker.startDate.format('DD/MM/YYYY'));
  });

   $('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
      $(this).val('');
   });


 });