Good morning guys,

i have a little issue with the editor.

I have some data that uses datetime-local format, so the user has to pick date, month, year, hour and minute. For selecting i use the browser-built-in datetimepicker - works fine.

In my software the user has to fill in a report what happens on a specific day (with up to 10 entrys/report).
Problem: The editor does not set the report date (e.g. 2023-01-13) as value, so the picker always uses "now()".

Thanks for helping me how to pass the date into the input field - i really haven't found a solution anywhere. Would be nice to have the dateformat "DD.MM.YYYY HH:MM"

(I skip the html.. it's just thead...)

JS:

$(document).ready(function() {
    $.ajaxSetup( {
        headers: {
            'X-CSRF-Token': csrfToken
        }
    } );
    // Activate an inline edit on click of a table cell
    let getData = async () => {

    }
    var editor;

    var i = 0;
    const types = [];
    for(var key in test) {
        types.push({
            'label': test[key],
            'value': key
        });
    }

    editor = new $.fn.dataTable.Editor({
        ajax: {
            url: "/reports-activities/update_reports/" + $('#report_id').html(),
            data: function(d) {
                d.csrfName;
            }
        },
        table: "#table-reports",
        idSrc:  'id',
        fields: [{
            label: "Activity Type",
            name: "activity_type",
            type: "select",
            options: types,
        },{
            label: "Starts at",
            name: "starts_at",
            attr: {
                type:'datetime-local'
            },
            format: 'YYYY-MM-DDTHH:mm:ss',
            displayFormat: "YYYY-MM-DD HH:mm:ss"
        },{
            label: "Ends at",
            name: "ends_at",
            attr: {
                type:'datetime-local'
            },
            format: 'YYYY-MM-DDTHH:mm:ss',
            displayFormat: "YYYY-MM-DD HH:mm:ss",
        },{
            label: "Train Number",
            name: "train_number",
        },{
            label: "Train From",
            name: "train_from",
        },{
            label: "Train to",
            name: "train_to",
        },{
            label: "Tfz",
            name: "tfz",
        },{
            label: "Note",
            name: "note",
        }]
    });

    $('#table-reports').on( 'click', 'tbody td:not(:first-child)', function (e) {
        editor.inline( this, {
            onBlur: 'submit'
        } );
    } );

    // Delete row
    $('#table-reports').on( 'click', 'tbody td.row-remove', function (e) {
        editor.remove( this.parentNode, {
            title: 'Delete record',
            message: 'Are you sure you wish to delete this record?',
            buttons: 'Delete'
        } );
    } );
    // Convert ISO8601 dates into a simple human readable format
    var table = $('#table-reports').DataTable( {
        language: {
            search: 'In der Tabelle finden',
            url: '...editor_locale.json',
        },
        searching: false,
        responsive: true,
        dom: "Bfrtip",
        ajax: {
            "url" : "/reports-activities/get-activitys-by-report/" + $('#report_id').html(),
            "data" : function(d) {
            }
        },
        columns: [
            {   // Responsive control column
                data: null,
                defaultContent: '',
                className: 'control',
                orderable: false
            },
            {   // Checkbox select column
                data: null,
                defaultContent: '',
                className: 'select-checkbox',
                orderable: false
            },
            { data: "id" },
            { data: "activity_type", render: function(data) {
                    if(data == null) {
                        return '';
                    }
                    for(var key in types) {
                        if(key == data) {
                            return types[key]['label'];
                        }
                    }
                }},
            { data: "starts_at", render: function(data) {
                    return moment(data).format('DD.MM.YYYY HH:mm');
                }
            },
            { data: "ends_at", render: function(data) {
                    return moment(data).format('DD.MM.YYYY HH:mm');
                }
            },
            { data: "train_number"},
            { data: "train_from"},
            { data: "train_to"},
            { data: "tfz"},
            { data: "note"},
        ],
        order: [ 2, 'asc' ],
        select: {
            style:    'os',
            selector: 'td.select-checkbox'
        },
        buttons: [ {
            extend: "createInline",
            editor: editor,
            formOptions: {
                submitTrigger: -2,
                submitHtml: '<i class="fa fa-play"/>'
            }
        },
            { extend: "edit",   editor: editor },
            { extend: "remove", editor: editor }
        ]
    });
}); 

Ajax-Response:

"data": [
        {
            "id": 27,
            "report_id": 23,
            "activity_type": 0,
            "starts_at": "2023-01-14T11:00:00+01:00",
            "ends_at": "2023-01-13T02:00:00+01:00",
            "train_number": "",
            "train_from": "",
            "train_to": "",
            "tfz": "",
            "note": "",
            "created": "2023-01-14T01:46:03+01:00",
            "modified": "2023-01-16T12:36:48+01:00",
            "DT_RowId": "row_27"
        },....