Demonstration
Introduces the basic use of ax5ui-calendar UI.

Marker

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 style="clear:both;"></div>'
        );

        // use Array
        new ax5.ui.calendar({
            target: document.getElementById("calendar-target-01"),
            marker: (function () {
                var marker = {};
                marker[_c_date(today, {'return':'yyyy-MM-dd', 'add': {d: -1}})] = true;
                marker[_c_date(today, {'return':'yyyy-MM-dd', 'add': {d: 0}})] = true;
                marker[_c_date(today, {'return':'yyyy-MM-dd', 'add': {d: 1}})] = true;
                
                console.log(marker);
                
                return marker;
            })(),
            onClick: function () {
                console.log(this)
            }
        });

        // use Object

        new ax5.ui.calendar({
            target: document.getElementById("calendar-target-02"),
            onStateChanged: function () {
                if (this.action == "printDay") {

                    var holidays = {};
                    holidays[_c_date(this.printedDay.start, {'return': 'yyyy-MM-dd', 'add': {d: 7}})] = {theme: 'holiday'};
                    holidays[_c_date(this.printedDay.start, {'return': 'yyyy-MM-dd', 'add': {d: 8}})] = {theme: 'holiday'};
                    holidays[_c_date(this.printedDay.start, {'return': 'yyyy-MM-dd', 'add': {d: 9}})] = {theme: 'holiday'};

                    this.self.setMarker(holidays);
                }
            }
        });

    });
</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