Как установить значение jQuery datepicker? ("setDate" не работает) - PullRequest
1 голос
/ 08 мая 2020

У меня проблемы с настройкой jQuery значение даты datepicker. Я получаю дату из базы данных sql, а затем пытаюсь установить ее в datepicker после ее форматирования. мой код jsp выглядит как

<div class="col-md-6 col-sm-6 col-xs-12 form-group">
                        <label>Date de Debut</label><span style="color:red;"></span>
                         <form:input
                            path="roles[0].startDate"
                            class="form-control" 
                            type="date"
                            pattern="dd-mm-yyyy"
                            name="dateDebut" 
                            id="dateDeDebut" 
                            required="true" />
                    </div>

мой Jquery код выглядит как

var start = row.roles[0].startDate;
    var date_start = new Date(start);
    var startDate = new Intl.DateTimeFormat('en-GB').format(date_start);//gives me this format "dd/mm/yyyy"

    $('#dateDeDebut').datepicker();
    $('#dateDeDebut').datepicker("setDate", startDate);

all fields ok, only datepickers not working not showing values

1 Ответ

0 голосов
/ 08 мая 2020

Я думаю, проблема связана с type="date", потому что вы также используете datepicker, поэтому просто измените type ввода всякий раз, когда вам нужно применить datepicker на dateDeDebut.

Ниже рабочий демонстрационный код:

$(function() {
//let start be 12-02-2020 
  var start = "12-02-2020";
  var date_start = new Date(start);
  var startDate = new Intl.DateTimeFormat('en-GB').format(date_start); //gives me this format "dd/mm/yyyy"
//changing date to text
  $('input[type=date]').each(function() {
    this.type = "text";
  });
  $('#dateDeDebut').datepicker();
  $('#dateDeDebut').datepicker('setDate', startDate);
 //printing value on console
  console.log($('#dateDeDebut').val());

});
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<div class="col-md-6 col-sm-6 col-xs-12 form-group">
  <label>Date de Debut</label><span style="color:red;"></span>
  <input path="roles[0].startDate" class="form-control" type="date" pattern="dd-mm-yyyy" name="dateDebut" id="dateDeDebut" required="true" />
</div>
...