添加新行后无法“刷新”filagroup tablesaw响应表

时间:2015-01-20 08:31:32

标签: javascript jquery html angularjs tablesaw

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

一旦我填充了表格,我就会在另一个名为responsive-table的指令中调用tablesaw“refresh”事件,它会使表格完全响应,并且对全世界都很好。

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

然而,当我然后更改页面(因此表中的行更改)时,表停止响应(如果您检查HTML,我可以看到新行没有在'tr上有相关的tablesaw类'元素虽然'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>

我已经发现大致哪些桌面代码出现“错误”(虽然我怀疑这只是我缺乏理解)

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

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

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

经过大量的tableaw代码后,我发现在插入新行并调用refresh,destroy甚至create事件后,上面的代码总是通过return语句退出。

是否有其他人遇到过这些问题或者我是否知道如何错误地使用这两个库来刷新/销毁/重新创建响应表?

2 个答案:

答案 0 :(得分:4)

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

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

$('#mytable').table().data("table").refresh()

答案 1 :(得分:0)

只是因为在调用refresh()之前加载了tbody&gt; tr&gt; td。这是偶然的。 refresh func不会调用snip $ cells.wrapInner(“”); $ cells.prepend(“”+ html +“”);“

您可以更改源代码。使用刷新事件的init事件inst。