简体   繁体   中英

how to select all raw with pagination in react-bootstrap-table?

import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
export default class StudentTable extends React.Component {


  render() {
    const selectRowProp = {
      mode: 'checkbox'
    };

    return (
      <BootstrapTable ref='table' data={ this.state.studentData } selectRow={ selectRowProp } pagination>
          <TableHeaderColumn dataField='id' isKey={ true }>Student ID</TableHeaderColumn>
          <TableHeaderColumn dataField='name'>Student Name</TableHeaderColumn>
          <TableHeaderColumn dataField='city'>City</TableHeaderColumn>
      </BootstrapTable>
    );
  }
}

When I implemented It show Pagination in Table with checkbox in all raw for selection.

But when I click on select all It will only select records of current page size.When I go to next page from pagination control,others records are not selected.

I want to select all records when I click on select all Checkbox.How Can I?

I found Solution from Here

import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
export default class StudentTable extends React.Component {
    onSelectAll = (isSelected) => {
     if (isSelected) {
        return this.state.studentData.map(row => row.id);
      } else {
        return [];
      }
   }

  render() {
    const selectRowProp = {
      mode: 'checkbox',
      onSelectAll: this.onSelectAll
    };

    return (
      <BootstrapTable ref='table' data={ this.state.studentData } selectRow={ selectRowProp } pagination>
          <TableHeaderColumn dataField='id' isKey={ true }>Student ID</TableHeaderColumn>
          <TableHeaderColumn dataField='name'>Student Name</TableHeaderColumn>
          <TableHeaderColumn dataField='city'>City</TableHeaderColumn>
      </BootstrapTable>
    );
  }
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM