Question

我在一页上有一些Bootstrap表。每个表都有一些数据属性（例如data-link="test-page"等）。除此之外，每个Bootstrap表的一列都使用data-formatter="actionFormatter"和column formatter。但是，我想在调用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
}

Answer 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();
}

从列选项获取调用表

1 个答案: