Материализовать datepicker SelectOnЗакрыть не работает

Я пытаюсь создать datepicker с Materialize. В соответствии с documentation датапикер должен закрываться, когда пользователь выбирает дату.Материализовать datepicker SelectOnЗакрыть не работает

Это не работает на моей странице. Я использую последний браузер Chrome в Windows. Я пробовал IE браузер, но есть все DatePicker не показывает ...

Click here for my page (вход 3 и 4 являются datepickers)

Мой JavaScript:

$('#due_date').pickadate({ 
 
    monthsFull: [ 'januari', 'februari', 'maart', 'april', 'mei', 'juni', 'juli', 'augustus', 'september', 'oktober', 'november', 'december' ], 
 
    monthsShort: [ 'jan', 'feb', 'maa', 'apr', 'mei', 'jun', 'jul', 'aug', 'sep', 'okt', 'nov', 'dec' ], 
 
    weekdaysFull: [ 'zondag', 'maandag', 'dinsdag', 'woensdag', 'donderdag', 'vrijdag', 'zaterdag' ], 
 
    weekdaysShort: [ 'zo', 'ma', 'di', 'wo', 'do', 'vr', 'za' ], 
 
    today: 'vandaag', 
 
    clear: 'verwijderen', 
 
    close: 'sluiten', 
 
    firstDay: 1, 
 
    format: 'dd-mm-yyyy', 
 
    formatSubmit: 'yyyy/mm/dd', 
 
    closeOnSelect: true, 
 
    selectMonths: true, // Creates a dropdown to control month 
 
    selectYears: 3, // Creates a dropdown of 15 years to control year 
 
    min: new Date() 
 
});

Может ли кто-нибудь помочь мне исправить этих датпикеров?

источник

2015-04-05 Ilona

Я думаю, это потому, что разработчик изменил его https://github.com/Dogfalo/materialize/commit/db0629d30a9d3e5ac06a019955a8e10062f91833 –

Разработчик материализовать думал, что это будет соответствовать выбора даты Google, если он не закрывается на выбор по этому вопросу:

https://github.com/Dogfalo/materialize/issues/870

Однако вы можете изменить исходный код материализоваться, если вы не «т ум, как это:

https://github.com/Dogfalo/materialize/commit/db0629d30a9d3e5ac06a019955a8e10062f91833

источник

2015-05-07 12:08:27

Спасибо за отзыв! – Dante

я была такая же проблема, и я решил это так:

$('.datepicker1').pickadate({ 
 
    selectMonths: true, // Creates a dropdown to control month 
 
    selectYears: 15, // Creates a dropdown of 15 years to control year 
 
    min: true, 
 
    onOpen: function() { 
 
     this.clear(); 
 
    }, 
 
    onSet: function() { 
 
     var x,y,year,date,month; 
 
     x = $('.datepicker1').pickadate().val().toString(); 
 
     y = x.split(/[ ,]+/); 
 
     date = y[0]; 
 
     month = y[1]; 
 
     year = y[2]; 
 
     console.log(y[0]+" "+ y[1]+ " "+ y[2]); 
 
     if(date && month && year){ 
 
     this.close(); 
 
     } 
 
    } 
 
    });

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Materialize Datepicker</title> 
 
    
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/css/materialize.min.css"> 
 
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/js/materialize.min.js"></script> 
 
</head> 
 
<body> 
 
    <form class="col s6"> 
 
    <label for="To" >To : </label> 
 
    <input type="date" id="To" class="datepicker1"> 
 
    </form> 
 
    
 
    <script src="site.js"></script> 
 
</body> 
 
</html>

Наступление: функция (вызывается, когда дата установлена) обеспечивает дату, месяц и год вводятся и закрывается только тогда, когда дата была установлена.

Функция onOpen: функция (называемая при открытии datepicker) очищает входные данные, когда датапикер открывается снова, полезно в случае, если пользователь вводит неверную дату. Без использования этой функции переходник datepicker не может перемещаться в разные месяцы, годы без закрытия ..

Надеюсь, что это решает вашу проблему.

источник

2015-06-03 21:20:41

Проблема с этим решением заключается в том, что он выполняется и закрывается, как только я нажимаю в любом месте выбора даты, а не только когда я выбираю дату, но когда я меняю месяц или год. – jalagrange

var datePicker = $('.datepicker').pickadate({ 
    onSet: function() { 
     this.close(); 
    } 
});

источник

2015-12-17 15:02:11

Пожалуйста, добавьте ниже несколько строк в код ..

onSet: function (ele) { 
    if(ele.select){ 
      this.close(); 
    } 
}

источник

2016-01-13 14:50:47 Kenath

отлично работает, спасибо! – javram

Отличный ответ, работал для меня спасибо –

Лучшее решение: Используйте if ('select' in arg) условие так, что диалог DatePicker обыкновение скрывать, когда вы выберите месяц или год.

$('.datepicker').pickadate({ 
    onSet: function(arg){ 
     if ('select' in arg){ //prevent closing on selecting month/year 
      this.close(); 
     } 
    } 
});

источник

2016-08-25 11:09:36

Хотя этот код может помочь решить проблему, он не объясняет _why_ и/или _how_, он отвечает на вопрос. Предоставление этого дополнительного контекста значительно улучшит его долгосрочную образовательную ценность. Пожалуйста, отредактируйте свой ответ, чтобы добавить объяснение, включая ограничения и допущения. –

Если "closeOnSelect: правда" не работает, то вы можете позвонить нажмите событию кнопки закрытия

HTML код для элемента ввода:

<input type='text' id='purchase_date'/>

Js код элемента:

jQuery(document).ready(function(){ 
    $('#purchase_date').pickadate({format: 'yyyy-mm-dd'}) 
         .on('change', function(){ 
           $(this).next().find('.picker__close').click(); 
         }); 
});

Надеюсь, что это решит вашу проблему.

источник

2016-09-11 12:27:57

Материализовать datepicker SelectOnЗакрыть не работает

ответ

Смежные вопросы