Question: JQuery DataTable select row with checkbox

Question

JQuery DataTable select row with checkbox

Answers 1
Added at 2016-12-31 06:12
Tags
Question

I am rendering a JQuery DataTable within a ReactJS application and the table draws fine. However when I try to draw checkboxes they are not drawn. I also tried to hard code two rows to be selected and I get a

TypeError: table.columns(...).select is not a function.

import 'datatables.net';
import dt from 'datatables.net-bs';
import 'datatables.net-select';

const table = container.find('.dataTable').DataTable({
  columnDefs: [{
    orderable: false,
    className: 'select-checkbox',
    targets: 0,
  }],
  select: {
    style: 'os',
    selector: 'td:first-child',
  },
  order: [[1, 'asc']],
});

table.columns([1, 2]).select();

Once I get row selection with checkboxes my next goal is to have column selection by checkboxes (ie row of checkboxes above header, on selection the column below is highlighted).

Any idea why checkbox row rendering may not be working?

Answers
nr: #1 dodano: 2016-12-31 14:12

Most likely you forgot to include CSS/JS files for Select extension. It needs to be included in addition to jQuery DataTables files.

Either use Download builder and include Select extension or download individual files for Select extension.

Also take a look at jQuery DataTables Checkboxes extension that simplifies handling of checkboxes in a table powered by jQuery DataTables.

Source Show
◀ Wstecz