Таблица данных Framework7 с установленным флажком

Question

данные стол

это моя таблица данных framework7

Я хочу выбрать строку с флажком, и когда я нажимаю кнопку проверки, которая находится рядом с кнопкой «Добавить»

Я могу получить данные строки.

после того, как я закончу читать https://framework7.io/docs/checkbox.html & https://framework7.io/docs/data-table.html#data-table-app-methods (Альтернативный заголовок с действиями строки)

У меня есть только идея: app.dataTable.get (el)

и не делай, что делать дальше. кто-нибудь может подсказать мне закончить это?

$$(document).on(‘page:init’, ‘.page[data-name=“home_employee”]’, function(e) {
console.log(‘this is page employee’);

var sqlget = 'SELECT * FROM `customers`';
//this is select the data from customers [emplotee_table (home_employee.html)]
connection.query(sqlget, function(error, results, fields) {

    for (i = 0; i < results.length; i++) {

        $$(document).find('#employee_table').append($$('<tr> ' +
            '<td class="checkbox-cell">' +
            '<label class="checkbox">' +
            '<input type="checkbox">' +
            '<i class="icon-checkbox"></i>' +
            '</label>' +
            '</td>' +
            ' <td style="font-family:Poppins-Medium;" class="label-cell"> ' + results[i].name + ' </td>' +
            ' <td class="numeric-cell">' + results[i].telephone + '</td> ' +
            ' <td class="numeric-cell">' + results[i].order_num + '</td> ' +
            '<td class="numeric-cell">' + results[i].juice1_num + '</td> ' +
            '<td class="numeric-cell">' + results[i].juice2_num + '</td> ' +
            '<td class="numeric-cell">' + results[i].juice3_num + '</td> ' +
            '<td class="numeric-cell">' + results[i].date + '</td> ' +
            '</tr>'));
    }
});
});

а вот мой html

 <div class="block block-strong">
        <div class="data-table search-content-list data-table-init card">
            <div class="card-header">
                <!-- Table links/actions -->
                <div class="data-table-links">
                    <!--ADD products button is at here-->

                    <a class="link dynamic-popup icon-only" id="products_add">
                        <i style="height: 25px;width:25px;" class="icon material-icons md-only">add_round</i>
                    </a>

                    <!--out products button is at here-->
                    <a class="link icon-only" id="product_out">
                        <i style="height: 25px;width:25px;" class="icon material-icons md-only">check_round</i>
                    </a>

                </div>


            </div>
            <div style="overflow-y:scroll; height:320px;" class="card-content">
                <table>
                    <thead>
                        <tr>
                            <th class="checkbox-cell">
                                <label class="checkbox">
                                        <input type="checkbox">
                                        <i class="icon-checkbox"></i>
                                      </label>
                            </th>

                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="label-cell">Customer Name</th>
                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="numeric-cell">Customer Numbers</th>
                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="numeric-cell">Orders Numbers</th>
                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="numeric-cell">Juice 1</th>
                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="numeric-cell">Juice2</th>
                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="numeric-cell">Juice 3</th>
                            <th style="font-family:Montserrat-Bold;color: black;font-size: 17px" class="numeric-cell">Date</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody id="employee_table">
                        <!--this is data from data_process.js-->
                    </tbody>
                </table>
            </div>
        </div>
    </div>

и после меня

console.log(app.dataTable.get());

это возвращение в моей консоли

t {eventsParents: Array(1), eventsListeners: {…}, params: {…}, $el: Dom7, el: div.data-table.search-content-list.data-table-init.card, …}
    $el: Dom7 {0: div.data-table.search-content-list.data-table-init.card, length: 1}
    $headerEl: Dom7 {length: 0}
    $headerSelectedEl: Dom7 {length: 0}
    attachEvents: ƒ ()
    collapsible: false
    detachEvents: ƒ ()
    el: div.data-table.search-content-list.data-table-init.card
    eventsListeners: {}
    eventsParents: [t]
    params: {el: div.data-table.search-content-list.data-table-init.card}
    __proto__: t

Я хочу получить значение из каждой строки, которую я проверял (потому что мне нужно вставить в другую таблицу MySQL)

и затем я хочу удалить выбранную строку (также удалить данные в таблице).