Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82458

Select with checkboxes not working properly

$
0
0

I just stared using DataTables. Thanks for the great component.
I want to use select with checkboxex, multi style. I want selected with checboxes to be highlighted and only them.
I have problems:

1-Header checkbox "select all" is not appearing
2-I tried several variations of styles, but all have problems.
2.1) if I use "multi", I see 2 select groups: A ) with checkboxes; B ) higlighted. And they are not the same. Select returns highlighted members
2.2) If I use "api", highlight is not working and select returns nothing
2.3) If I use "os", only one is highlighted, multiple checkgoxes selected and select returns only hightlited.
3) button selectNone does not uncheck checkboxes

Code fragments

select: {
    style: 'os',
    selector: 'td:first-child',
    headerCheckbox: true,
    className: 'bg-warning'
},

columns: [
 {   //0

     orderable: false,
     visible: true,
     render: DataTable.render.select(),
     width: "50px",
 },
 
 layout: {
    top1Start: {
        buttons:
            [
                'selectNone',
                {
                    text: 'Get selected data',
                    action: function () {
                        let myRows = myTable.rows({ selected: true });
                        let data = myRows.data();
                        let ids = myPluck(data, 'id');
                        let idsString = ids.toArray().join(',');

                        alert('Selected:'+idsString);
                    }
                },
                {
                    text: 'Deselect',
                    action: function () {
                        let myRows = myTable.rows({ selected: true });
                        myRows.deselect();
                    }
                }
            ]
    }

Viewing all articles
Browse latest Browse all 82458

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>