3

我正在使用 AngularJS Utils 分页指令和 filamentgroup tablesaw 响应表库的组合来尝试获得响应（通过向右滑动）分页表。

一旦我填充了表格，我就从另一个名为 responsive-table 的指令中调用 tableaw “刷新”事件，它使表格完全响应并且一切都很好。

$("tableselector").table("refresh")

但是，当我然后更改页面（因此表中的行发生更改）时，表停止响应（如果您检查 HTML，我可以看到新行在“tr”元素上没有相关的表锯类，而'th' 元素仍然可以）。

我有点预料到这一点，并试图再次调用刷新事件，但没有奏效，所以我尝试了销毁事件，但这似乎也不起作用！

下面是我的 HTML 供参考。

<table class="table table--stripe" data-mode="swipe" responsive-table>
  <thead>
    <tr>
      <th>Email</th>
      <th>Name</th>
      <th>User role</th>
      <th></th>
    </tr>
  </thead>

  <tbody>

    <tr dir-paginate="user in Model.Users | itemsPerPage:Model.PageSize" current-page="Model.CurrentPage">
      <td>{{user.Email}}</td>
      <td>{{user.DisplayName}}</td>
      <td>{{user.Role}}</td>
      <td>{{user.Telephone}}</td>
    </tr>
  </tbody>
</table>

我大致发现了 tableaw 代码似乎“错误”的地方（尽管我怀疑这只是我缺乏理解）

 $.fn[pluginName] = function ()
    {
        return this.each(function ()
        {
            var $t = $(this);

            if ($t.data(pluginName))
            {
                return;
            }

            var table = new Table(this);
            $t.data(pluginName, table);
        });
    };

在浏览了很多tablesaw代码之后，我发现上面的代码总是在插入新行并调用刷新、销毁甚至创建事件后通过return语句退出。

有没有其他人遇到过这些问题，或者知道我是否错误地使用了任一库来刷新/销毁/重新创建响应表？

4

2 回答 2

5

所以我在 GitHub 上被https://github.com/zachleat指出了正确的方向。

在用户单击以移动到下一个分页页面后，我不得不稍微更改刷新表格的代码行。

$('#mytable').table().data("table").refresh()
于 2015-01-29T07:59:34.237 回答
0

只是因为 tbody>tr>td 在调用 refresh() 之前加载。一不小心就对了。刷新函数不调用片段 $cells.wrapInner(""); $cells.prepend("" + html + "");"

您可以更改源代码。使用初始化事件代替刷新事件。

于 2015-09-26T16:19:02.730 回答