Datepicker on “focus” event in Laravel

Tags: , ,



I have a datatable where I have the option to edit the date of every record in that table, so I need to use “document on focus” event to get all my datepickers to work. The problem here is that my datepicker only works when I click on the input, if I click in the “icon” it doesn´t work.

This is my datepicker in the form:

      <div class="form-group">
        <label for="fecha" class="col-form-label">Fecha</label>
        <div class="input-group date" id="datepickerEditT" data-target-input="nearest">                      
            <input type="text" id="datepickerEditT" name="fechaTratamiento" value="{{date('d/m/Y',strtotime($fecha))}}" class="form-control datepicker-input" data-target="#datepickerEditT" required/>
            <div class="input-group-append" data-target="#datepickerEditT" data-toggle="datepickerEditT">
                <div class="input-group-text"><i class="fas fa-calendar-alt"></i></div>
            </div>
        </div>
      </div> 

and this is the javascript:

$(document).on("focus", "#datepickerEditT", function () {
  $(this).datepicker({
    format: "dd/mm/yyyy",
    language: "es",
    autoclose: true,
    todayHighlight: true,
  });
});  

if I dont use on focus event my datepicker works fine, doesn´t matter if I click on the input or the icon, but I need to use this event because if I dont, my datepicker will only works on the first record in the table.

Answer

I used class div instead of the id like someone said and now everything its working without using the focus event.

$(".datepickerEditT").datepicker({
  format: "dd/mm/yyyy",
  language: "es",
  autoclose: true,
  todayHighlight: true,
});


Source: stackoverflow