Почему стол закрыт?

Question

Почему таблица "#reservations" закрывается, когда я добавляю свойство "responsive: true"? (Когда вы открываете детский ряд.) Помогите мне, пожалуйста.

При повторном нажатии на строку

введите описание изображения здесь

function format(d) {
    return '<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" id="records" width="100%">' +
                '<thead>' +
                    '<tr>' +
                        '<th>Запись</th>' +
                    '</tr>' +
                '</thead>' +
           '</table>';
}

(function($){

$(document).ready(function() {
    var editor = new $.fn.dataTable.Editor( {
        ajax: 'inc/DataTablesEditor/php/table.useruserreservations.php',
        table: '#reservations',
        fields: [
            {
                "label": "\u0411\u0440\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435:",
                "name": "reservation"
            }
        ]
    } );

    var table = $('#reservations').DataTable( {
        ajax: 'inc/DataTablesEditor/php/table.useruserreservations.php',
        columns: [
            {
                "data": "reservation",
                "class": "details-control"
            }
        ],
        select: true,
        lengthChange: false,
        pageLength: 6,
        responsive: true
    } );

    $('#reservations tbody').on('click', 'td.details-control', function() {
        var tr = $(this).closest('tr');
        var row = table.row(tr);

        if (row.child.isShown()) {
            row.child.hide();

            tr.removeClass('shown');
        } else {
            if ( table.row( '.shown' ).length ) {
                $('.details-control', table.row( '.shown' ).node()).click();
            }

            var d = row.data();

            row.child(format(d)).show();
            tr.addClass('shown');

            var editor2 = new $.fn.dataTable.Editor( {
                ajax: 'inc/DataTablesEditor/php/table.useruserrecords.php',
                table: '#records',
                fields: [
                    {
                        "label": "\u0417\u0430\u043f\u0438\u0441\u044c:",
                        "name": "record"
                    }
                ]
            });

            var table2 = $('#records').DataTable( {
                ajax: {
                    url: 'inc/DataTablesEditor/php/table.useruserrecords.php',
                    "type": "POST",
                    "data": {
                        "record_reservation": table.row( this ).id().replace(/[^-0-9]/gim,'')
                    }
                },
                columns: [
                    {
                        "data": "record",
                        "class": "details-control2"
                    },
                    {
                        "data": "record_user"
                    }
                ],
                "columnDefs": [
                    {
                        "targets": [ 1 ],
                        "visible": false,
                        "searchable": false
                    }
                ],
                select: true,
                lengthChange: false,
                pageLength: 6,
                responsive: true
            });
    });


} );

}(jQuery));