DataTables Editor date in text input field in edit entry window

grid

Hello,

There shows no date up in my text input field when I use the calendar. I have to add it manual. In the examples it shows up automatically. What do I need to adjust?

        }, {
            label:     'Updated date:',
            name:      'updated_date',
            type:      'datetime',
            def:       function () { return new Date(); },
            format:    'MM-DD-YYYY h:mm A',
            fieldInfo: 'US style m-d-y date input with 12 hour clock'
        }, {

Thanks,

grid

grid

Looks like it works using some exact names like: updated_date or others. For example: name: start_date is not working. Hope I'm right with this.

grid

Once I update the .php .js and table with the field name it will not work anymore.

allan

Hi grid,

Could you show me your PHP and Javascript for Editor please?

Thanks,
Allan

grid

Allan, yes.

PHP:

<?php

/*
 * Editor server script for DB table markers
 * Created by http://editor.datatables.net/generator
 */

// DataTables PHP library and database connection
include( "lib/DataTables.php" );

// Alias Editor classes so they are easy to use
use
    DataTables\Editor,
    DataTables\Editor\Field,
    DataTables\Editor\Format,
    DataTables\Editor\Mjoin,
    DataTables\Editor\Options,
    DataTables\Editor\Upload,
    DataTables\Editor\Validate,
    DataTables\Editor\ValidateOptions;

// The following statement can be removed after the first run (i.e. the database
// table has been created). It is a good idea to do this to help improve
// performance.
$db->sql( "CREATE TABLE IF NOT EXISTS `markers` (
    `id` int(10) NOT NULL auto_increment,
    `city` varchar(255),
    `currentdatetime` datetime,
    `newdatetime` datetime,
    PRIMARY KEY( `id` )
);" );

// Build our Editor instance and process the data coming from _POST
Editor::inst( $db, 'markers', 'id' )
    ->fields(
        Field::inst( 'city' ),
        Field::inst( 'currentdatetime' )
            ->validator( Validate::dateFormat( 'Y-m-d H:i:s' ) )
            ->getFormatter( Format::datetime( 'Y-m-d H:i:s', 'Y-m-d H:i:s' ) )
            ->setFormatter( Format::datetime( 'Y-m-d H:i:s', 'Y-m-d H:i:s' ) ),
        Field::inst( 'newdatetime' )
            ->validator( Validate::dateFormat( 'Y-m-d H:i:s' ) )
            ->getFormatter( Format::datetime( 'Y-m-d H:i:s', 'Y-m-d H:i:s' ) )
            ->setFormatter( Format::datetime( 'Y-m-d H:i:s', 'Y-m-d H:i:s' ) )
    )
    ->process( $_POST )
    ->json();

JS:

/*
 * Editor client script for DB table markers
 * Created by http://editor.datatables.net/generator
 */

(function($){

$(document).ready(function() {
    var editor = new $.fn.dataTable.Editor( {
       ajax: {
            url: "php/table.markers.php",
            type: "POST"
        },
        serverSide: true,
        table: '#markers',
        fields: [
            {
                "label": "City:",
                "name": "city"
            },
            {
                "label": "Current date:",
                "name": "currentdatetime",
                "type": "datetime",
                "def":       function () { return new Date(); },
                "format": "YYYY-MM-DD HH:mm:ss"
            },
            {
                "label": "Update date:",
                "name": "newdatetime",
                "type": "datetime",
                "def":       function () { return new Date(); },
                "format": "YYYY-MM-DD HH:mm:ss"
            }
        ]
    } );

    var table = $('#markers').DataTable( {
        dom: 'Bfrtip',
               ajax: {
            url: "php/table.markers.php",
            type: "POST"
        },
        serverSide: true,
        columns: [
            {
                "data": "city"
            },
            {
                "data": "currentdatetime"
            },
            {
                "data": "newdatetime"
            }
        ],
        select: true,
        lengthChange: false,
        buttons: [
            { extend: 'create', editor: editor },
            { extend: 'edit',   editor: editor },
            { extend: 'remove', editor: editor }
        ]
    } );
} );

}(jQuery));

allan

One more thing I'm afraid, can you show me the JSON data that is being loaded from the server by DataTables? I don't immediately see what is going wrong from your code above.

Thanks,
Allan

grid

Yes, here it is:

{"data":[{"DT_RowId":"row_2922714","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922715","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922716","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922717","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922718","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922719","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922720","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922721","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922722","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2922723","city":"Amsterdam","currentdatetime":null,"newdatetime":null}],"options":[],"files":[],"draw":6,"recordsTotal":"3373649","recordsFiltered":"511326"}

Thank you,

grid

allan

"currentdatetime":null,"newdatetime":null

That will do it.

If you remove the getFormatter from the PHP code, what is then in the JSON returned from the server?

Allan

grid

After that it will give this back again:

{"data":[{"DT_RowId":"row_2949120","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3014656","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3080192","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3145728","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3211264","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3276800","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3342336","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3407872","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_2949376","city":"Amsterdam","currentdatetime":null,"newdatetime":null},{"DT_RowId":"row_3014912","city":"Amsterdam","currentdatetime":null,"newdatetime":null}],"options":[],"files":[],"draw":2,"recordsTotal":"3373649","recordsFiltered":"511326"}

It will save ok in both ways. It is only the date that will not get updated in the text input. I did test at different clients/servers.

{"data":[{"DT_RowId":"row_1","city":"Mycity","currentdatetime":"2018-08-16 12:43:34","newdatetime":"2018-08-30 12:43:39"}],"options":[],"files":[],"draw":5,"recordsTotal":"3373649","recordsFiltered":"1"}