Dateinput

Formulářový prvek pro výběr data a času.

Download	https://github.com/…hives/master
Github	https://github.com/voda/DateInput
Fórum	http://forum.nette.org/…o-vyber-data
Autor	Ondřej Vodáček
Licence	New BSD License

Na straně serveru pracuje prvek s objekty DateTime. V prohlížeči používá jqueryUI kalendář s rozšířením timepicker.

Doplněk funguje s Nette verzí 2.0 i s verzí 0.9.x(v gitu ve vlastní větvi).

Závislosti

* jQuery a jQueryUI
* Timepicker addon

Instalace

do šablony vložit potřebné css a js:

<script type='text/javascript' src="{$basePath}/scripts/jquery-ui-timepicker-addon.js"></script>
<script type='text/javascript' src="{$basePath}/scripts/dateInput.js"></script>
<link rel="stylesheet" type="text/css" href="{$basePath}/styles/jquery-ui-timepicker-addon.css">
<link rel="stylesheet" type="text/css" href="{$basePath}/styles/dateInput.css">

do bootstrap přidat registraci:

Vodacek\Forms\Controls\DateInput::register();

Inicializace kalendářů pomocí javascriptu:

$('input[data-dateinput-type]').dateinput({
    datetime: {
        dateFormat: 'd.m.yy',
        timeFormat: 'h:mm'
    },
    'datetime-local': {
        dateFormat: 'd.m.yy',
        timeFormat: 'h:mm'
    },
    date: {
        dateFormat: 'd.m.yy'
    },
    month: {
        dateFormat: 'MM yy'
    },
    week: {
        dateFormat: "w. 'týden' yy"
    },
    time: {
        timeFormat: 'h:mm'
    }
});

Ukázka

use Vodacek\Forms\Controls\DateInput;

class DatePresenter ... {
    public function createComponentDateForm() {
        $form = new Nette\Application\UI\Form();
        $form->addDate('date', 'Date', DateInput::TYPE_DATE);
        $form->addDate('datetime', 'Datetime', DateInput::TYPE_DATETIME);
        $form->addDate('datetimeLocal', 'Local datetime', DateInput::TYPE_DATETIME_LOCAL);
        $form->addDate('month', 'Month', DateInput::TYPE_MONTH);
        $form->addDate('week', 'Week', DateInput::TYPE_WEEK);
        $form->addDate('time', 'Time', DateInput::TYPE_TIME);
        $form->addSubmit('save', 'Save');
        ...
        return $form;
    }
}

Ukázka nefunguje v IE, protože odmítne načíst JS od githubu poslané jako text/plain.

---

Login to submit a comment