flatpickr 0.1.1
flatpickr: ^0.1.1

Dart js
Flutter web

Dart interop for flatpickr - a lightweight and powerful datetime picker.

Flatpickr (Dart) #

Dart interop package for Flatpickr v4+ - a lightweight and powerful datetime picker.

Usage #

  1. Register the Dart package in your pubspec.yaml:

     dependencies:
       flatpickr: ^0.0.1
    
  2. Load the latest Flatpickr source (js and css) in your html layout:

     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
     <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
    
  3. Create a Flatpickr instance:

     import 'dart:html';
    
     import 'package:flatpickr/flatpickr.dart';
     import 'package:js/js.dart';
    
     void main() {
       final el = document.getElementById('some_input_element');
    
       final options = FlatpickrOptions(
         enableTime: true,
         showMonths: 2,
         onChange: allowInterop((selectedDates, dateStr, instance, e) {
           print(selectedDates);
         }),
       );
    
       final obj = Flatpickr(el, options);
    
       obj.open(); // or any other instance method
     }
    

NB! When passing a Dart function as event callback, make sure to wrap it with allowInterop() or allowInteropCaptureThis().

Check the API reference for detailed documentation.

To view the example, run pub global run webdev serve example from the root directory of this project.

0
likes
100
pub points
20%
popularity

Dart interop for flatpickr - a lightweight and powerful datetime picker.

Repository (GitHub)
View/report issues

Documentation

API reference

Uploader

gani.georgiev@gmail.com

License

BSD (LICENSE.md)

Dependencies

js

More

Packages that depend on flatpickr