Question

当我单击引导表的特定行时，有什么方法可以获取每个单元格的值。我想在其他一些函数中访问该行的所有单元格的值。目前我的rowClick事件传递了单击行的索引。这是我的表

<Table className='flags-table' id="flags-table" responsive hover>
                    <thead>
                    <tr>
                        <th></th>
                        <th> Time In</th>
                        <th> Time Out</th>
                        <th> Type</th>
                        <th> Category</th>
                    </tr>
                    </thead>
                    <tbody>
                    {
                        this.props.tag_fetch_reducer.tags.map((x, i) => (
                            <tr className={i === this.props.marker_reached_reducer.index ? 'selected' : ''} key={i} onClick={this.handleRowClick.bind(this, i)}>
                                <td>
                                    <div className='red-box'></div>
                                </td>
                                <td> {this.secondsToHms(x.time)} </td>
                                <td> {this.secondsToHms(x.stopTime)} </td>
                                <td> {x.tagname} </td>
                                <td> {x.category}</td>
                            </tr>
                        ))
                    }
                    </tbody>
                </Table>

Answer 1

我使用的方法是为行本身的每个单元格设置数据属性。这样做，它允许您轻松访问值。您只需使用javascript / jQuery（我的示例使用jQuery）连接该行的click事件：

BEGIN {print "Hi"}

(function(document, window, $) {
  $('.flags-table tbody tr').on('click', function() {
    var time = $(this).data('time');
    var stopTime = $(this).data('stop-time');
    var tagName = $(this).data('tag-name');
    var category = $(this).data('category');
    var key = $(this).data('key');

    alert('Values: \r\n' +
      'Time: ' + time + '\r\n' +
      'Stop: ' + stopTime + '\r\n' +
      'Tag: ' + tagName + '\r\n' +
      'Category: ' + category + '\r\n' +
      'Key: ' + key + '\r\n');
  });
})(document, window, jQuery);

在bootstrap表中单击时获取行的单元格值

1 个答案: