不能＆QUOT;刷新＆QUOT; filamentgroup添加新行后tablesaw响应表 [英] can't "refresh" filamentgroup tablesaw responsive table after adding new rows
问题描述
我使用的是AngularJS utils的分页指令和filamentgroup tablesaw响应表库相结合的尝试，并得到一个负责任的（通过右键刷卡），分页表。
一旦我填充我称之为tablesaw刷新事件从另一个指令中的表称为响应表，它使表完全反应灵敏，一切都很好与世界同步。
$（tableselector）。表（刷新） \r
然而，当我再改页（因此表中的行更改）表不再是响应的（如果你检查HTML我可以看到，新行没有对'TR相关tablesaw类日'元素'，而'的元素仍然这样做）。
我种预计并试图再次调用刷新事件，但没有工作，所以我试图销毁事件，似乎没有要么工作！
下面是我参考HTML。
＆LT;表类=table表 - 条纹数据模式=刷卡有求必应-表＆gt;\r
＆LT;＆THEAD GT;\r
＆所述; TR＆GT;\r
＆LT;第i个电子邮件和LT; /第i\r
＆LT;第i个姓名和LT; /第i\r
百分位＆gt;用户角色＆LT; /第i\r
百分位＆GT;＆LT; /第i\r
＆LT; / TR＆GT;\r
＆LT; / THEAD＆GT;\r
\r
＆LT;＆TBODY GT;\r
\r
＆LT; TR DIR-PAGINATE =用户Model.Users | itemsPerPage：Model.PageSize当前页=Model.CurrentPage＆GT;\r
＆所述; TD＆GT; {{user.Email}}＆下; / TD＆GT;\r
＆所述; TD＆GT; {{user.DisplayName}}＆下; / TD＆GT;\r
＆所述; TD＆GT; {{user.Role}}＆下; / TD＆GT;\r
＆所述; TD＆GT; {{user.Telephone}}＆下; / TD＆GT;\r
＆LT; / TR＆GT;\r
＆LT; / TBODY＆GT;\r
＆LT; /表＆gt; \r
我粗略发现那里的tablesaw code似乎走错（虽然我怀疑这只是我缺乏了解）
$ .fn [pluginName] =功能（）\r
{\r
返回this.each（函数（）\r
{\r
VAR $ T = $（本）;\r
\r
如果（$ t.data（pluginName））\r
{\r
返回;\r
}\r
\r
无功表=新表（本）;\r
$ t.data（pluginName，表）;\r
}）;\r
}; \r
通过大量的tablesaw code的打算后，我发现，上述code总是通过return语句退出插入新行和刷新，破坏甚至制造事件称为后。
任何人都有这些问题，或不知道如何，如果我使用的不是正确的库刷新/销毁/重建响应表？
于是我就在GitHub上正确的方向好心指出https://github.com/zachleat 。
我不得不稍微改变code那刷新用户点击移动到下一个页面分页表后线。
$（'＃MYTABLE'）。表（）。数据（表）。刷新（）
I am using a combination of the AngularJS Utils pagination directive and the filamentgroup tablesaw responsive table library to try and get a responsive (by swiping right), paginated table.
Once I have populated the table I call the tablesaw "refresh" event from within another directive called responsive-table and it makes the table fully responsive and all is good with the world.
$("tableselector").table("refresh")
However, when I then change page (and therefore the rows change in the table) the table stops being responsive (if you inspect the HTML I can see that the new rows don't have the relevant tablesaw classes on the 'tr' elements whilst the 'th' elements still do).
I kind of expected this and tried to call the refresh event again but that didn't work, so I tried the destroy event and that didn't seem to work either!
Below is my HTML for reference.
<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>
I have found roughly where the tablesaw code appears to go "wrong" (although I suspect this is just my lack of understanding)
$.fn[pluginName] = function ()
{
return this.each(function ()
{
var $t = $(this);
if ($t.data(pluginName))
{
return;
}
var table = new Table(this);
$t.data(pluginName, table);
});
};
After going through a lot of the tablesaw code I found that the above code always exits via the return statement after the new rows are inserted and the refresh, destroy or even create events are called.
Has anyone else had these issues or know how if I am using either library incorrectly to refresh/destroy/recreate the responsive table?
So I was kindly pointed in the right direction on GitHub by https://github.com/zachleat.
I had to slightly change the line of code that refreshes the table after a user has clicked to move to the next paginated page.
$('#mytable').table().data("table").refresh()
这篇关于不能＆QUOT;刷新＆QUOT; filamentgroup添加新行后tablesaw响应表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
