Как добавить пустую строку в таблицу данных

Question

Я использую JQuery DataTables и пытаюсь добавить пустую строку в DataTable. У меня есть код ниже, но новая пустая строка не добавляется.

Как мне нужно переписать это, чтобы добавить пустую строку?

<script>
$(document).ready(function () {
    $("#btnCheck").click(function () {
        var table = $('#data').DataTable({
            dom: 'Bfrtip',
            buttons: [ 'copy', 'csv', 'excel', 'pdf', 'print' ],
            "ajax": function (data, callback, settings) {
                $.ajax({
                    url: 'https://localhost:44328/api/employee-data',
                    dataType: "JSON",
                    success: function (data) {
                            var o = {"data":[]};
                            for(var i in data.data)
                            {
                                var row = [data.data[i].empID,data.data[i].empSA];
                                o.data.push(row);
                            }
                            callback(o);
                    }
                })
            }
        })
    });
        $('#AddRow').on('click', function () {
        var t = $('#data').DataTable();
        t.row.add( [] ).draw();
    } );
    $('#AddRow').click();
});
</script>

РЕДАКТИРОВАТЬ
Я отредактировал код для этого, но теперь я получаю несколько ошибок в консоли .... поэтому я, должно быть, неправильно понял ...

<script>
$(document).ready(function () {
var table;
    $("#btnCheck").click(function () {
        $('#data').DataTable({
            dom: 'Bfrtip',
            buttons: [ 'copy', 'csv', 'excel', 'pdf', 'print' ],
            "ajax": function (data, callback, settings) {
                $.ajax({
                    url: 'https://localhost:44328/api/employee-data',
                    dataType: "JSON",
                    success: function (data) {
                            var o = {"data":[]};
                            for(var i in data.data)
                            {
                                var row = [data.data[i].empID,data.data[i].empSA];
                                o.data.push(row);
                            }
                            callback(o);
                    }
                })
            }
        })
    });
        $('#AddRow').on('click', function () {
        table.row.add( [] ).draw();
    } );
    $('#AddRow').click();
});
</script>

Редактировать 2
Это мой HTML

<div id="dtTapCount">
<table id="data" class="display nowrap" cellspacing="0" width="100%">
<thead>
    <tr>
        <th>EmpID</th>
        <th>EmpSA</th>
    </tr>
</thead>
</table>
</div>

Answer 1

Попробуйте создать экземпляр var table вне области видимости. И в событии AddRow вызовите его, чтобы добавить строку.
Перейдите к документации DataTables , есть больше информации о том, как добавить строки.

var table;
$(document).ready(function () {
    $("#btnCheck").click(function () {
        table = $('#data').DataTable({
            dom: 'Bfrtip',
            buttons: [ 'copy', 'csv', 'excel', 'pdf', 'print' ],
            "ajax": function (data, callback, settings) {
                $.ajax({
                    url: 'https://localhost:44328/api/employee-data',
                    dataType: "JSON",
                    success: function (data) {
                        var o = {"data":[]};
                        for(var i in data.data)
                        {
                            var row = [data.data[i].location,data.data[i].tapCount];
                            o.data.push(row);
                        }
                        callback(o);
                    }
                })
            }
        });
    });
    $('#AddRow').on('click', function () {
        table.row.add(['' /* Location */, 0 /*Tap count */]).draw();
    });
    //$('#AddRow').click(); This is going to be called when AddRow button pressed.
});