Material inspirado fecha & selector de tiempo-simplePicker

Tiempo de ejecución: 30 minutos. Empezar

Autor: priyank-p
Views Total: 1,780
Sitio oficial: Ir a la web
Actualizado: February 15, 2019
Licencia: MIT

Vista prévia

Material inspirado fecha & selector de tiempo-simplePicker

Descripción

simplePicker es un plugin de JavaScript vainilla para crear material Design Selector de fechas inspirado con selector de tiempo integrado.

Funcionamiento

Instale e importe el simplePicker en su proyecto.

# NPM
$ npm install simplepicker --save
// ES 6
import SimplePicker from 'simplepicker';

// CommonJS:
const SimplePicker = require('simplepicker');

O directamente incluir los siguientes archivos JS y CSS en la página.

<link rel="stylesheet" href="dist/simplepicker.css">
<script src="dist/simplepicker.js"></script>

Cree un nuevo selector de fecha y especifique el contenedor de destino al que se debe anexar el selector de fecha (default: Body).

let myPicker = new SimplePicker(el);

Abrir/cerrar el selector de fecha.

myPicker.open()
myPicker.close()

Establezca la propiedad z-index del selector de fecha.

let myPicker = new SimplePicker(el,{


zIndex: 10
});

Desactive/habilite la selección de tiempo.

let myPicker = new SimplePicker(el,{


disableTimeSection: false
});

// or
myPicker.disableTimeSection()
myPicker.enableTimeSection()

Event handlers available.

myPicker.on('submit', function(date, readableDate){

// ...
})

myPicker.on('close', function(date){

// ...
})

Registro de cambios

02/15/2019

  • v2.0.0: fix simplepicker breaking in firefox

01/05/2019

  • v1.2.4: avoid querying elements from other instance.

Te puede interesar: