Demonstration
Introduces the basic use of ax5ui-calendar UI.

Selectable

html

<div id="build-target"></div>
<script type="text/javascript">
    $(document.body).ready(function () {
        var
            buildTarget = $("#build-target"),
            today = new Date(),
            _c_date = ax5.util.date;

        buildTarget.html(
            '<div id="calendar-target-01" style="width:300px;border:1px solid #888;padding: 10px;float:left;margin: 10px;"></div>'
            + '<div id="calendar-target-02" style="width:300px;border:1px solid #888;padding: 10px;float:left;margin: 10px;"></div>'
            + '<div id="calendar-target-03" style="width:300px;border:1px solid #888;padding: 10px;float:left;margin: 10px;"></div>'
            + '<div style="clear:both;"></div>'
        );

        // use Array
        new ax5.ui.calendar({
            target: document.getElementById("calendar-target-01"),
            selectable: [
                _c_date(today, {'add': {d: -1}}),
                _c_date(today, {'add': {d: 0}}),
                _c_date(today, {'add': {d: 1}})
            ],
            onClick: function () {
                console.log(this)
            }
        });

        // use Range
        new ax5.ui.calendar({
            target: document.getElementById("calendar-target-02"),
            onClick: function () {
                console.log(this)
            }
        })
        .setSelectable({
            range: [
                {from: _c_date(today, {'add': {d: -4}}), to: _c_date(today, {'add': {d: 4}})}
            ]
        });


        // use Object
        var selectable = {};
        for (var d = _c_date(today, {'add': {d: -1}}); d <= _c_date(today, {'add': {d: 4}}); d.setDate(d.getDate() + 1)) {
            selectable[_c_date(d, {'return':'yyyy-MM-dd'})] = true;
        }

        new ax5.ui.calendar({
            target: document.getElementById("calendar-target-03"),
            selectable: selectable,
            onClick: function () {
                console.log(this)
            }
        });

    });
</script>

AX5UI Package

'AX5UI' can be used with Bootstrap theme. The development of the distribution of the various UI plug-in. When you click the link to move to AX5UI index page.

Get AXBoot

AXBoot makes it easy to build web applications with Java & HTML5 Repeatable and noise development process are resolved by AXBoot.

Code licensed
MIT
Mantained by
Thomas Jang, Brant and Team AXISJ
Templete design by
Jorwrney Kim
Copyright
Opensource Group AXISJ - www.axisj.com
DNS
DNSEver