从列选项获取调用表答案

【问题标题】：Get calling table from column option从列选项获取调用表
【发布时间】：2019-04-30 14:59:31
【问题描述】：

我在一页上有几个 Bootstrap 表。每个表都有一些数据属性（如data-link="test-page" 等）。除此之外，每个 Bootstrap 表的一列使用column formatter，使用data-formatter="actionFormatter"。但是，我想在调用 actionFormatter 时获取当前表的数据属性，因此基于数据属性我可以返回一个字符串。

this 和 $(this) 都返回一个对象，这不起作用。 $(this).closest('table').data() 也不起作用，而我认为那是最真实的。

这是我使用的代码：

<th data-field="actions" data-formatter="actionFormatter" data-events="actionEvents">Actions</th>

this 返回带有行属性的 JSON 对象，$(this).closest('table').data(XXX) 返回未定义。我希望它返回一个包含所有数据属性的数组。

有没有办法从格式化程序中获取当前的处理表？

示例代码：

<!-- table 1 -->
<table
    data-actions="edit,remove"
    data-url="some/url"
>
    <thead>
        <tr>
            <th data-formatter="actionFormatter">Actions</th>
        </tr>
    </thead>
</table>

<!-- table 2 -->
<table
    data-actions="edit,remove"
    data-url="some/url"
>
    <thead>
        <tr>
            <th data-formatter="actionFormatter">Actions</th>
        </tr>
    </thead>
</table>


// actionFormatter:
function actionFormatter(value, row, index, field) {
    // get data-actions from the right table somehow, 
    // and return a string based on data-url/other
    // data attributes
}

【问题讨论】：

您能否添加最少的代码来重现您正在解释的行为？
完成！添加了一个示例代码来重现。

标签： javascript jquery bootstrap-table

【解决方案1】：

似乎在调用动作格式化程序时，执行上下文this是一个对象，其中包含所有引导表行关联数据以及行的所有data-*属性。

考虑到这一点，您可以为每个表添加一个 id，并为您的行添加一个 data-table-id 属性，例如：

<table
    id="table-1"
    data-actions="edit,remove"
    data-url="some/url"
>
<thead>
    <tr>
        <th data-formatter="actionFormatter" data-table-id="table-1">Actions</th>
    </tr>
</thead>

以便在您的格式化程序中，您可以使用该 id 检索表 DOM 元素：

function actionFormatter(value, row, index, field) {
    // get data-actions from the right table somehow, 
    // and return a string based on data-url/other
    // data attributes
    var data = $('#' + this.tableId).data();
}

【讨论】：