Materialize datepicker SelectOnClose non funziona

Sto provando a creare un DatePicker con Materialize. In base allo documentation, il datapicker deve chiudersi quando l'utente seleziona una data.Materialize datepicker SelectOnClose non funziona

Questo non funziona nella mia pagina. Sto utilizzando l'ultimo browser Chrome su Windows. Ho provato browser IE, ma c'è tutto il DatePicker non mostrare ...

Click here for my page (datepickers ingresso 3 e 4 sono)

mio 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() 
 
});

Qualcuno può aiutarmi a riparare questi datepickers?

fonte

2015-04-05 Ilona

Penso che sia perché lo sviluppatore ha cambiato https://github.com/Dogfalo/materialize/commit/db0629d30a9d3e5ac06a019955a8e10062f91833 –

Lo sviluppatore di Materialise pensato che sarebbe partita di Google selezione data se non si chiude su di selezione in base a questo problema:

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

Tuttavia è possibile modificare il codice sorgente di materializzare se don 't mente, in questo modo:

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

fonte

2015-05-07 12:08:27

Grazie per il suggerimento! – Dante

ho avuto lo stesso problema e ho risolto in questo modo:

$('.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>

l'insorgenza: funzione (chiamata quando è impostata una data) assicura la data, il mese e l'anno vengono immessi e chiude solo quando è impostata la data.

La funzione onOpen: (chiamata quando si apre il datapicker) cancella l'input quando si apre nuovamente datepicker, utile nel caso in cui l'utente immetta la data errata. Senza utilizzare questa funzione, il datepicker non può navigare attraverso diversi mesi, anni senza chiusura ..

Spero che questo risolva il tuo problema.

fonte

2015-06-03 21:20:41

Il problema con questa soluzione è che si esegue e si chiude non appena clicco sul selezionatore di date, non solo quando scelgo una data ma quando cambio anche il mese o l'anno. – jalagrange

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

fonte

2015-12-17 15:02:11

Il problema con questa soluzione è che si esegue e si chiude non appena clicco sul selezionatore di date, non solo quando scelgo una data, ma quando cambio mese o anno, – jalagrange

Si prega di aggiungere poche righe sotto al codice ..

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

fonte

2016-01-13 14:50:47 Kenath

funziona perfettamente, grazie! – javram

risposta perfetta, ha funzionato per me grazie –

soluzione migliore: Usa if ('select' in arg) condizione in modo che la finestra di datepicker solito nascondere quando si seleziona mese o anno.

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

fonte

2016-08-25 11:09:36

Anche se questo codice può aiutare a risolvere il problema, non spiega _why_ e/o _how_ risponde alla domanda. Fornire questo contesto aggiuntivo migliorerebbe significativamente il suo valore educativo a lungo termine. Si prega di [modificare] la risposta per aggiungere una spiegazione, compresi quali limitazioni e ipotesi si applicano. –

Se "closeOnSelect: true" non funziona allora si può chiamare Click del pulsante di chiusura

codice HTML per l'elemento di input:

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

codice Js per l'elemento:

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

Spero che questo risolva il tuo problema.

fonte

2016-09-11 12:27:57

Materialize datepicker SelectOnClose non funziona

risposta

Problemi correlati