Set checkbox table with one data column

Set checkbox table with one data column

LazulBoyLazulBoy Posts: 2Questions: 1Answers: 0

Hello,

I try to create a table with two columns, the first one for checkboxes and the second with data from array of strings.
I initiate my datatable like this :

var arrayOfStrings = ["TEST1", "TEST2"];
$('#test).DataTable({
"dom": "<'row'tr><'row'p>",
"responsive": true,
"scrollCollapse": true,
"columnDefs": [ {
orderable: false,
className: 'select-checkbox',
targets: 0
},
{ orderable: false,
className: 'string',
targets: 1} ],
"language": {
"zeroRecords": "Error",
"paginate": {
"previous": "<<",
"next": ">>"
}
}
});

I try to add my array of strings into it or with the add methods but nothing seems to work :

$('#test).DataTable({
"dom": "<'row'tr><'row'p>",
"responsive": true,
"scrollCollapse": true,
"columnDefs": [ {
orderable: false,
className: 'select-checkbox',
targets: 0
},
{ orderable: false,
className: 'string',
targets: 1} ],
"language": {
"zeroRecords": "Error",
"paginate": {
"previous": "<<",
"next": ">>"
}
},
"data": arrayOfStrings
});

// OR

$('#test).DataTable().rows(1).data(arrayOfStrings).draw();

// OR

$('#test).DataTable().rows.add(arrayOfStrings).draw();

But as result, I have rows with only one letter inside. How can I fill the first column with checkboxes and second one with data inside my array "arrayOfStrings" ?

Thanks you

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,173Questions: 26Answers: 4,923
    Answer ✓

    Are you expecting ["TEST1", "TEST2"] to populate a single cell in one row or have shown on two rows?

    When using data or rows.add() (not the plural rows instead of row.add()) the data is expected to be an array of the row data. Start by looking at this example. Making the assumption that you want two rows of data I built this example:
    http://live.datatables.net/gonilugi/1/edit

    When using array based data it can be tricky to get the array elements in the columns you want. By default Datatables will populate the first column with the first array element. But you want to start with the data in the second column.

    Instead of columnDefs I changed the example to use columns. It also uses columns.data to define where the array elements go. I added the use of defaultContent and data: null to the checkbox column to make sure no row data is displayed.

    Kevin

  • LazulBoyLazulBoy Posts: 2Questions: 1Answers: 0

    Hello Kevin,

    Thank you !
    It seems so simple when the solution is found :)

    I have about 50,000 rows to insert and I need a filter. I also checked another plugin named "clusterize.js" and it looks promising as well.

    I'll try both and see which is better in terms of response time and memory consumption.

    Thanks again !

  • kthorngrenkthorngren Posts: 21,173Questions: 26Answers: 4,923

    If you need checkout this FAQ about speed optimization with Datatables.

    Kevin

This discussion has been closed.