javascript - i18n - pickadate

Cómo configurar la fecha en materialize datepicker

Question

Estoy utilizando materializecss.com Datepicker. Cuando intento establecer la fecha con jquery, la fecha no se establece. Aquí está mi código: -

// Materialize Date Picker
    window.picker = $(''.datepicker'').pickadate({
        selectMonths: true, // Creates a dropdown to control month
        selectYears: 100, // Creates a dropdown of 15 years to control year
        format: ''dd/mm/yyyy''    
    });

<input type="text" id="Date" class="datepicker" />

Al hacer clic en el evento de un botón, estoy configurando la fecha:

$("#Date").val(''23/01/2015'');

Cuando abro el selector de fechas me muestra la fecha de hoy.

¿Cómo configurar la fecha en materialize datepicker?

Answer 1

Materialize datepicker es un selector pickadate.js modificado.

De acuerdo con sus documentos API , esta es la forma de configurar el selector:

1. Obtener el selector:

var $input = $(''.datepicker'').pickadate()

// Use the picker object directly.
var picker = $input.pickadate(''picker'')

1. Establecer la fecha:

// Using arrays formatted as [YEAR, MONTH, DATE].
picker.set(''select'', [2015, 3, 20])

// Using JavaScript Date objects.
picker.set(''select'', new Date(2015, 3, 30))

// Using positive integers as UNIX timestamps.
picker.set(''select'', 1429970887654)

// Using a string along with the parsing format (defaults to `format` option).
picker.set(''select'', ''2016-04-20'', { format: ''yyyy-mm-dd'' })

Answer 2

Puede usar los métodos de selección de fecha que están presentes en V1.0.0-rc.2 .

<script>
    document.addEventListener(''DOMContentLoaded'', function () {
        var options = {
            defaultDate: new Date(2018, 1, 3),
            setDefaultDate: true
        };
        var elems = document.querySelector(''.datepicker'');
        var instance = M.Datepicker.init(elems, options);
        // instance.open();
        instance.setDate(new Date(2018, 2, 8));
    });
</script>

defaultDate establecerá una Fecha predeterminada que se mostrará en el campo de entrada del selector de fechas sin abrir el selector.

instance.setDate() seleccionará la fecha en el selector de fecha en que la abrirá.

Nota- new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]]);

El argumento monthIndex está basado en 0. Esto significa que January = 0 y December = 11

Selector - Materializar

MDN - Fecha

Answer 3

Todas las respuestas con pickadate () ya no funcionan en las versiones más recientes de Materialise. El método ahora se llama datepicker (). Aquí está mi fragmento de código:

var element = document.querySelector(''.datepicker'');
M.Datepicker.getInstance(element).setDate(new Date(2018,8,7), true);

Answer 4

simplemente agregue el formato que desea que tenga su fecha en los atributos de su elemento.

$(''.datepicker'').pickadate({
    selectMonths: true, // Creates a dropdown to control month
    selectYears: 15, // Creates a dropdown of 15 years to control year
    format: ''dd-mm-yyyy'' });

Answer 5

var $input = $(''.datepicker'').pickadate()

// Use the picker object directly.
var picker = $input.pickadate(''picker'')

Título

Answer 6

$(''#elementID'').pickadate(''picker'').set(''select'', ''21/05/2017'', { format: ''dd/mm/yyyy'' }).trigger("change");

Esto debe satisfacer sus necesidades en una sola línea. El cambio de activación que pueda necesitar o tal vez no, depende de su situación, como yo, la necesito para que la validación se active. También incluya con fecha de formato en caso de que algunas personas lo necesiten.