javascript - Datatables.net 使用 Spring 进行服务器端分页 : How to select single row's ID?

Question

我正在开发一个带有 React 前端和 Spring Boot 后端的 Web 应用程序。我正在使用带有服务器端分页的数据表( Spring Controller 等等)。它可以查看表格和不同的页面。但是，现在我想单击该行来选择其 ID。我尝试遵循数据表中的不同示例，但它总是返回空。我还通过 npm 安装了 datatables.net-select-bs4，也许我可以以某种方式使用它？抱歉，我是数据表新手。 我现在拥有的(正面):

import React, { Component } from 'react'
import '../dataTables.min.css';

const $ = require('jquery');
$.DataTable = require('datatables.net-bs4');

export default class Table extends Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    var selected = [];
    var table = $('#paginatedTable').DataTable( {
        "dom": '<"data-table-wrapper"t>',
        "processing": true,
        "serverSide": true,
        "pageLength": 5,
        "ajax": {
            "url": "/map-runner/api/calculations",
            "data": function (data) {
         }},
        "columns": this.props.columns,
        "rowCallback": function(row, data) {
                if ( $.inArray(data.DT_RowId, selected) !== -1 ) {
                    $(row).addClass('selected');
                }
            }
    });

    $('#paginatedTable tbody').on('click', 'tr', function () {
        var id = this.id;
        var index = $.inArray(id, selected);

        if (index === -1) {
            selected.push(id);
        } else {
            selected.splice(index, 1);
        }

        $(this).toggleClass('selected');

        console.log(table.rows( { selected: true } ));

    } );
  }

  componentWillUnmount() {
       $('.data-table-wrapper').find('table').DataTable().destroy(true);
    }


    render() {
        return (
    <div class="container">
      <div class="starter-template">
            <div class="table-responsive">
                <table id="paginatedTable" class="table table-striped">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>Name</th>
                            <th>Date Create</th>
                            <th>Date Update</th>
                            <th>User ID</th>
                            <th>ID Type</th>
                        </tr>
                    </thead>
                </table>
               </div> 
      </div>
    </div>
        )
    }
}

Answer 1

我不确定100%，但我认为如果你想使用this.id，你必须在数据表初始化中使用下一个属性:

rowId: 'staffId'

staffId 是您用于设置 id 的列的名称。

文档:

https://datatables.net/reference/option/rowId