Question

我已经搜索过任何合理的帮助，我会继续回复相同的评论。即不是很好的文档。

我即将使用jquery插件fooTable，它将普通的html表转换为漂亮且可用的东西。

将表格放在页面上后，可以使用以下命令轻松使用。

        $('.footable').footable();

但是我希望在扩展行时捕获事件。

以下是该表的实例。我实际上正在使用Inspinia框架。

http://wrapbootstrap.com/preview/WB0R5L90S

您需要点击左侧的表格/ footables菜单链接。

我不确定这是否是我应该知道的fooTable问题/事件，或者这是否是使用适用于许多事情的jquery捕获事件的一般知识。

我的jquery语言技能只有几个月了，因为我很长一段时间VB，MSSQL程序员正在学习新东西。

感谢任何善意为新手提供任何帮助的人！

尼尔

Answer 1

您可以将函数绑定到某些可启用事件：

$('.footable').footable().bind({
    'footable_row_collapsed' : function(e) {
        //Your code when a row is collapsed
    },

    'footable_row_expanded' : function(e) {
        //Your code when a row is expanded                  
    },
});

以下是关于足迹事件拦截的文档（http://fooplugins.com/footable/demos/event-interception.htm#docs）。

以下是可填充事件列表（http://fooplugins.com/footable/demos/events.htm#docs）。

Answer 2

缺乏足够的文档将最终成为该产品的终结。

此处列出了文档：https://fooplugins.github.io/FooTable/docs/jsdocs/FooTable.html

扩展事件似乎是最常用的。以下是使用AJAX交换细节行的示例：

$(".footable").on("expand.ft.row", function (e, ft, row) {
  var EmployeeId = row.value.EmployeeId //Access data from a specific column
  var RowElement = $(row.$el) //This is the underlying DOM element for the row (<tr>...</tr>)
  if (EmployeeId) {
    $.get({
      url: "http://ajax-provider/" + EmployeeId,
      dataType: "html",
      success: function (data) {
        var DetailRow = RowElement.next(".footable-detail-row")
        DetailRow.children("td").html(data)
      }
    })
  }
}

足够并捕获展开行事件

2 个答案: