# j-Period

> Komponenten för att välja en tidsperiod.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: sv
Content-SHA256: a7b420d56532e707e8f312b125d64e2bd6298036af1bcf6bd70885bf1db28d49
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Komponenten för att välja en tidsperiod.

- singlar

__Metoder__:

Metod: `component.show(options)`

- `options.element` {Element/jQuery Element} - alla alligationsberäkningar kommer att vara relativa till detta element
- `options.align` Anpassa komponenten i förhållande till elementet i `options.element` egenskap. Tillgängliga egenskaper: 'center', 'vänster' och 'rätta'.
- `options.callback`-funktion, som kommer att utföras genom att klicka på knappen "Applicera" av komponenten - får två parametrar: start och slutdatum objekt
- `options.start`, `options.end` {Date} - För att förutse den valda perioden ska **båda** av dessa egenskaper anges.


__Konfigurera__:

- `firstday` - {String} - Tillåter att ställa in den första dagen i veckan till måndag. standardvärdet är 'månad' - Dagar i veckan börjar från måndagen.
- `dateformat` - {String} - Anger datumformat. standardvärdet - `DEF.dateformat`
- `apply` - {String} - Etikett för "Apply" knappen
- `cancel` - {String} - Etikett för knappen "Avbryt"
- `custom` - {String} - Etikett för "Custom" filter knappen
- `month` - {String} - Etikett för "För närvarande månad" filter knappen
- `thisY` - {String} - Etikett för "Denna år" filter knappen
- `lastY` - {String} - Etikett för "Last year" filter knappen

Använd den med `<ui-component name="period">`När komponenten ännu inte är laddad, jComponent Ladda ner den första gången från adressen i `DEF.fallback` (en av Componentator Författare: Kirill Zlobin. källa: The Componentator Komponenterna i lager, MIT licens.

```html example.html
<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>
```