Foo Table 开始无法正常工作 phone 屏幕尺寸

Foo Table its not working startly phone screensize

我在我的项目中使用了 footable 插件。

但是,它无法在 phone 屏幕上启动。 首先,我通过 chrome 开发人员工具更改了屏幕大小,它像这样工作正常,

但是当我的代码像这样在 phone screen.so 上重新工作时它不起作用

我的html代码;

       <div id="tablelistDiv">
       <div class="row">
       <table id="tbl_search" class="footable" data-page-size="20">
        <thead>
            <tr>
                <th data-toggle="true" data-sort-ignore="false">Sıra No</th>
                <th data-sort-ignore="false">Ünvan</th>
                <th data-hide="phone" data-sort-ignore="false">Şube</th>
                <th data-hide="phone" data-sort-ignore="false">Broker</th>
                <th data-hide="phone" data-sort-ignore="false">Durum</th>
                <th data-hide="phone" data-sort-ignore="false">Kayıt Tar.</th>
                <th data-hide="phone" data-sort-ignore="true"><i class="fa fa-search"></i></th>
            </tr>
          </thead>
          <tbody>
          </tbody>
          <tfoot>
          <tr>
           <td colspan="7">
             <div class="pagination pagination-centered hide-if-no-paging"></div>
           </td>
          </tr>
         </tfoot>
     </table>
    </div>
    </div>

我的Js代码是,

function detayKayitlar(jsondata, status) {
                    obj = JSON.parse(jsondata);
                    var tableHtml = "";
                    for (var i = 0; i < obj.length; i++) {
                        tableHtml = tableHtml
                            + "<tr>"
                            + "<td>" + obj[i].ID + "</td>"
                            + "<td>" + obj[i].UNVAN + "</td>"
                            + "<td>" + obj[i].SUBE + "</td>"
                            + "<td>" + obj[i].BROKER + "</td>"
                            + "<td>" + obj[i].USERLASMA + "</td>"
                            + "<td>" + obj[i].KAYITTAR + "</td>"
                            + "<td><button onclick='detayKayit(" + obj[i].ID + ",2);' class='btn btn-block btn-danger'  type='button'><i class='fa fa-search'></button></td>"
                            + "</tr>";

                    }

                    $("#tbl_search tbody").append(tableHtml);
                    jQuery(function () {
                        jQuery('#tbl_search').footable();
                    });

                    pWaitHide();
                    hideDiv('search');
                    showDiv('list');
                }

由于您的 chrome 在桌面上,因此工作正常。请检查您是否在 header 标签中添加了以下行。此视口将检测屏幕尺寸。

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

what do you mean with rework? if you doing something dynamically you can run $('#tbl_search').trigger('footable_redraw');

第一行评论来自@Almis。 谢谢