Inline Calendar Picker Date Time Not Working/Rotating


#1

Hi Guys, I’m using the inline date picker where as I cannot choose from the date. Its not rotating. I followed the guidelines. Heres an image:

Here’s the code I base it into

 onClickSetStartDate: function () {
        var today = new Date();
        var pickerInline = app.picker.create({
            containerEl: '#demo-picker-date-container',
            inputEl: '#demo-picker-date',
            toolbar: false,
            rotateEffect: true,
            value: [
                today.getMonth(),
                today.getDate(),
                today.getFullYear(),
                today.getHours(),
                today.getMinutes() < 10 ? '0' + today.getMinutes() : today.getMinutes()
            ],
            formatValue: function (values, displayValues) {
                return displayValues[0] + ' ' + values[1] + ', ' + values[2] + ' ' + values[3] + ':' + values[4];
            },
            cols: [
                // Months
                {
                    values: ('0 1 2 3 4 5 6 7 8 9 10 11').split(' '),
                    displayValues: ('January February March April May June July August September October November December').split(' '),
                    textAlign: 'left'
                },
                // Days
                {
                    values: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31],
                },
                // Years
                {
                    values: (function () {
                        var arr = [];
                        for (var i = 1950; i <= 2030; i++) { arr.push(i); }
                        return arr;
                    })(),
                },
                // Space divider
                {
                    divider: true,
                    content: '&nbsp;&nbsp;'
                },
                // Hours
                {
                    values: (function () {
                        var arr = [];
                        for (var i = 0; i <= 23; i++) { arr.push(i); }
                        return arr;
                    })(),
                },
                // Divider
                {
                    divider: true,
                    content: ':'
                },
                // Minutes
                {
                    values: (function () {
                        var arr = [];
                        for (var i = 0; i <= 59; i++) { arr.push(i < 10 ? '0' + i : i); }
                        return arr;
                    })(),
                }
            ],
            on: {
                change: function (picker, values, displayValues) {
                    var daysInMonth = new Date(picker.value[2], picker.value[0] * 1 + 1, 0).getDate();
                    if (values[1] > daysInMonth) {
                        picker.cols[1].setValue(daysInMonth);
                    }
                },
            }
        });
        pickerInline.open();
    },

#2

Code looks correct, will be good to see live example or JSFiddle with the issue