bootstrap datatables problem

Question

Witam, mam pytanie. Próbuje za pomocą Bootstrap datatables (https://bootstrap-table.com/) napisać tabelkę, w której będę mógł zaznaczać poszczególne wiersze za pomocą checkboxów. Jednak gdy wyszukuje dane checkboxy się odznaczają. Co muszę zrobić, aby checkboxy nie odznaczały się w trakcie wyszukiwania wartości? Co robię źle?

Poniżej podsyłam swój aktualny kod:

<table id="bootstrap-table" class="table"
                                    data-id-field="id" data-response-handler="responseHandler"
                                >
                                    <thead>
                                        <th data-field="state" data-checkbox="true"  ></th>
                                        <th data-field="id" class="text-center">ID</th>
                                        <th data-field="imie" data-sortable="true">Imię</th>
                                        <th data-field="drugieImie" data-sortable="true">Drugie imię</th>
                                        <th data-field="nazwisko" data-sortable="true">Nazwisko</th>
                                        <th data-field="miejscowosc" data-sortable="true">Miejscowość</th>
                                        


                                    </thead>
                                    <tbody>
                                    @foreach($forms as $form)
                                        <tr>
                                            <td></td>
                                            <td>{{$form->id}}</td>
                                            <td>{{$form->imie}}</td>
                                            <td>{{$form->drugieImie}}</td>
                                            <td>{{$form->nazwisko}}</td>
                                            <td>{{$form->miejscowosc}}</td>


                                        </tr>
                                        @endforeach

                                    </tbody>
                                </table>

var $table = $('#bootstrap-table');

$().ready(function() {
    $table.bootstrapTable({
        toolbar: ".toolbar",
        clickToSelect: true,
        showRefresh: true,
        search: true,
        showToggle: true,
        showColumns: true,
        pagination: true,
        searchAlign: 'left',
        pageSize: 8,


        pageList: [8, 10, 25, 50, 100],

        formatShowingRows: function(pageFrom, pageTo, totalRows) {
            //do nothing here, we don't want to show the text "showing x of y from..."
        },
        formatRecordsPerPage: function(pageNumber) {
            return pageNumber + " rows visible";
        },
        icons: {
            refresh: 'fa fa-refresh',
            toggle: 'fa fa-th-list',
            columns: 'fa fa-columns',
            detailOpen: 'fa fa-plus-circle',
            detailClose: 'fa fa-minus-circle'
        }

    });

    //activate the tooltips after the data table is initialized
    $('[rel="tooltip"]').tooltip();

    $(window).resize(function() {
        $table.bootstrapTable('resetView');

    });


});




var selections = [];
function getIdSelections() {
    return $.map($table.bootstrapTable('getSelections'), function (row) {
      return row.id
    })
  }
  $table.on('check.bs.table uncheck.bs.table ' +
      'check-all.bs.table uncheck-all.bs.table',
    function () {


      // save your data, here just save the current page
      selections = getIdSelections()
      // push or splice the selections if you want to save all data selections
    })
function responseHandler(res) {
    
    
    $.each(res.rows, function (i, row) {
      row.state = $.inArray(row.id, selections) !== -1
    })
    return res
  }