Fix for using HTML5-datepicker for format="datetime" (not "datetime-local")

[mbknor]

Hi,

HTML5 supports datepicker for "datetime-local" (without timezone) but not "datetime" which uses timezone.

If you use the below custom editor, it will let you edit it with the HTML5 datetime-local datepicker, but still get JSON with (default)) timezone.

        // Custom editor
        JSONEditor.defaults.editors.dateTime = JSONEditor.defaults.editors.string.extend({
            getValue: function() {

                function getTimeZone() {
                    var offset = new Date().getTimezoneOffset(), o = Math.abs(offset);
                    return (offset < 0 ? "+" : "-") + ("00" + Math.floor(o / 60)).slice(-2) + ":" + ("00" + (o % 60)).slice(-2);
                }

                return this.value+getTimeZone();
            },

            setValue: function(val) {

                // strip timeZone
                var stripedDateTime = val.substring(0, val.lastIndexOf("+"));


                if(this.value !== stripedDateTime) {
                    this.value = stripedDateTime;
                    this.input.value = this.value;
                    this.refreshPreview();
                    this.onChange();
                }
            },

            build: function() {
                this.schema.format = "datetime-local";
                this._super();

            }
        });

        // Instruct the json-editor to use the custom datetime-editor.
        JSONEditor.defaults.resolvers.unshift(function(schema) {
            if(schema.type === "string" && schema.format === "datetime") {
                return "dateTime";
            }

        });

[JWDobken]

is there a way to change to date format to "yyyy-MM-dd hh:mm:ss Z"??

Or preferably implement this datetime picker

[JWDobken]

Aha, I changed the build function:

build: function () {
    this._super();
    defaultDate = new Date()
    $(this.input).datetimepicker({
        format: 'YYYY-MM-DD HH:mm Z',
        defaultDate: defaultDate
    })
        .on('changeDate', function () {
            var path = $(this).prop("name").replace(/\[/g, ".").replace(/\]/g, "");
            editor.getEditor(path).setValue($(this).val());
        });
}