Flatpickr defaultDate через код - PullRequest
       6

Flatpickr defaultDate через код

0 голосов
/ 26 апреля 2018

Я использую Flatpickr из Wix Code через html-компонент.Связь, использующая postMessage / onMessage, работает отлично.Я могу отправить выбранную дату из DatePicker (HTML-компонент) обратно в Wix.Кроме того, я могу отправить на компонент, из Wix.Проблема в том, что я отправляю сообщение с верной датой, оно приходит идеально, но затем мне нужно установить его как свойство defaultDate flatpickr.И это, я не могу работать.Строка $ ("# startDate"). Flatpickr.defaultDate = event.data;или $ ("# startDate"). defaultDate = event.data;не устанавливайте defaultDate.В файле event.data указана действительная дата.

Это проблема синтаксиса, я знаю, но я не могу ее понять.

Код ниже:

<!doctype html>
<html>
  <head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/flatpickr.css">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/themes/material_green.css"> 
  </head>
<script type="text/javascript">
    window.onmessage = (event) => {
    if (event.data) {
        $("#startDate").flatpickr.defaultDate = event.data;
    }
};

function sendLoadMessage () {
    window.parent.postMessage("LoadOk", "*");
}
</script>
<body onload="sendLoadMessage ();" style="font-family: verdana;background-color:white;margin:0;padding:0">
  <div>
    <input type="text" hidden="true" id="startDate" data-input>
</div>

    <!-- jQuery -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <!--  Flatpickr  -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/flatpickr.js"></script>
<script src="https://npmcdn.com/flatpickr/dist/l10n/es.js"></script>
<script>
$("#startDate").flatpickr({
    enableTime: false,
    dateFormat: "d/m/Y",
    inline: true,
    locale: "es",  
<!-- defaultDate : "01/05/2018",-->
    onChange: function(selectedDates, dateStr, instance) {
        window.parent.postMessage(selectedDates, "*");
    },
});


</script>
</body>
 </html>

1 Ответ

0 голосов
/ 07 сентября 2018

Сначала вы должны сохранить экземпляр flatpickr при создании

var flatpickr = $("#startDate").flatpickr({});

, а затем использовать установщик конфигурации

flatpickr.set('defaultDate', event.data);
...