always shown checkbox not updating underlying database table

Datagaard

I have a dataTable with an always shown checkbox that when changed doesn't update the underlying database table. I have followed the "Always Shown checkbox" example, but I must have missed something.

I can make the change in the Editor okay, but not from within the dataTable.

Code:

<?php

/*
 * Editor server script for DB table TeleMedApplications
 * 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\Upload,
    DataTables\Editor\Validate;

// Build our Editor instance and process the data coming from _POST
Editor::inst( $db, 'TeleMedApplications', 'ApplicationID' )
    ->fields(
        Field::inst( 'TeleMedApplications.ApplicationID' )->set(false),
        Field::inst( 'TeleMedApplications.ApplicationName' )
            ->validator( 'Validate::notEmpty' ),
        Field::inst( 'TeleMedApplications.ApplicationTypeID' )
            ->options( 'TeleMedApplicationTypes','ApplicationTypeID', 'ApplicationTypeDesc')
            ->validator( 'Validate::dbValues' ),
        Field::inst( 'TeleMedApplicationTypes.ApplicationTypeDesc' ),
        Field::inst( 'TeleMedApplications.Notes' ),
        Field::inst( 'TeleMedApplications.Inactive' )
            ->setFormatter(function ($val, $data, $opts) {
                return ! $val ? 0 : 1;          
            })
    )
    ->leftJoin( 'TeleMedApplicationTypes', 'TeleMedApplicationTypes.ApplicationTypeID', '=', 'TeleMedApplications.ApplicationTypeID' )
    ->process( $_POST )
    ->json();

<?php
>
```
?>


Js:

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

(function($){

$(document).ready(function() {
var editor = new $.fn.dataTable.Editor( {
ajax: 'php/table.TeleMedApplications.php',
table: '#TeleMedApplications',
fields: [
{
"label": "Application ID:",
"name": "TeleMedApplications.ApplicationID"
},
{
"label": "Name:",
"name": "TeleMedApplications.ApplicationName"
},
{
"label": "Application Type ID:",
"name": "TeleMedApplications.ApplicationTypeID",
"type": "select"
},
{
"label": "Notes:",
"name": "TeleMedApplications.Notes",
"type": "textarea"
},
{
"label": "Inactive:",
"name": "TeleMedApplications.Inactive",
"type": "checkbox",
"separator": "|",
"options": [
{ label: '', value: 1}
]
}
]
} );

var table = $('#TeleMedApplications').DataTable( {
    dom: 'Bfrtip',
    ajax: 'php/table.TeleMedApplications.php',
    columns: [
        { "data": "TeleMedApplications.ApplicationID" },
        { "data": "TeleMedApplications.ApplicationName" },
        { 
            "data": "TeleMedApplicationTypes.ApplicationTypeDesc"
        },
        { "data": "TeleMedApplications.Notes" },
        {
            "data": "TeleMedApplications.Inactive",
            "render": function (data, type, row){
                if (type === 'display'){
                    return '<input type="checkbox" class="editor-active">';             
                }
                return data;                
            },
            "className": "dt-body-center"
        }
    ],
    select: {
        style: 'os',
        selector: 'td:not(:last-child)' // no row selection on last column      
    },
    lengthChange: false,
    responsive: true,
    buttons: [
        { extend: 'create', editor: editor },
        { extend: 'edit',   editor: editor },
        { extend: 'remove', editor: editor }
    ],
  rowCallback: function ( row, data ) {
        // Set the checked state of the checkbox in the table
        $('input.editor-active', row).prop( 'checked', data.TeleMedApplications.Inactive == 1 );
  }
} );

$('#example').on( 'change', 'input.editor-active', function () {
    editor
        .edit( $(this).closest('tr'), false )
        .set( 'TeleMedApplications.Inactive', $(this).prop( 'checked' ) ? 1 : 0 )
        .submit();
} );

} );

}(jQuery));

Html:

<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

    <title>DataTables Editor - TeleMedApplications</title>

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jqc-1.12.3/moment-2.13.0/dt-1.10.12/b-1.2.2/b-print-1.2.2/r-2.1.0/se-1.2.0/datatables.min.css">
    <link rel="stylesheet" type="text/css" href="css/generator-base.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/select/1.2.0/css/select.dataTables.min.css">
    <link rel="stylesheet" type="text/css" href="css/editor.dataTables.min.css">

    <script type="text/javascript" charset="utf-8" src="https://cdn.datatables.net/v/dt/jqc-1.12.3/moment-2.13.0/dt-1.10.12/b-1.2.2/b-print-1.2.2/r-2.1.0/se-1.2.0/datatables.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="https://cdn.datatables.net/buttons/1.2.1/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="https://cdn.datatables.net/select/1.2.0/js/dataTables.select.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/dataTables.editor.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/table.TeleMedApplications.js"></script>
</head>
<body class="dataTables">
    <div class="container">

        <h1>
            DataTables Editor <span>TeleMedApplications</span>
        </h1>

        <table cellpadding="0" cellspacing="0" border="0" class="display" id="TeleMedApplications" width="100%">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Application Type ID</th>
                    <th>Notes</th>
                    <th>Inactive</th>
                </tr>
            </thead>
        </table>

    </div>
</body>

</html>

```

Datagaard

Why is always when you post a comment, you find the answer. The onchange event did not reference the correct table id.

Doh!

allan

Thanks for posting back - good to hear you've got it working!

Allan