j-Period

Le composant pour la sélection d'une période de temps.

• singleton

Méthodes :

Méthode : component.show(options)

• options.element {Element/jQuery Element} - Tous les calculs d'alligment seront relatives à cet élément
• options.align Alignez le composant par rapport à l'élément dans la propriété options.element. Propriétés disponibles: 'centre', 'à gauche' et 'à droite'.
• La fonction options.callback, qui sera exécutée en cliquant sur le bouton 'Application' du composant - reçoit deux paramètres: les objets de date de début et de fin
• options.start, options.end {Date} - Afin de pré-déterminer la période sélectionnée, il convient d'indiquer les deux de ces propriétés.

Configuration :

• firstday - {String} - Permet de définir le premier jour de la semaine à lundi. La valeur défaite est 'Monday' - Les jours de la journée commencent du lundi.
• dateformat - {String} - spécifie le format de date. la valeur par défaut - DEF.dateformat
• apply - {String} - Étiquette pour le bouton "Apply"
• cancel - {String} - Étiquette pour le bouton "Cancel"
• custom - {String} - Étiquette pour le bouton de filtre "Custom"
• month - {String} - Étiquette pour le bouton de filtre "Mont actuel"
• thisY - {String} - Étiquette pour le bouton de filtre "Cette année"
• lastY - {String} - Étiquette pour le bouton de filtre "L'année dernière"

Utilisez-le avec <ui-component name="period">. Lorsque le composant n'est pas encore chargé, jComponent le télécharge lors de la première utilisation depuis l'adresse dans DEF.fallback (le CDN Componentator par défaut). Auteur : Kirill Zlobine. Source : le référentiel de composants Componentator, licence MIT.

<ui-component name="LAZY period"></ui-component>

<button class="btn">Click</button>

<script>

    $(document).on('click', '.btn', function() {
        var opt = {};
        opt.element = $(this);
        opt.align = 'left';
        opt.callback = function(start, end) {
            console.log(start);
            console.log(end);
        };
        SETTER('period/show', opt);
    });


</script>