When a checkbox is unchecked, get the row value

santosh.sahoo@devoteam.com

Hello,

I have a simple datatable with datatable.js and datatable select.js
After initialization, I have all the checkbox checked.

What I need is to get the details(values) of the row that the user unchecks. Is there an easy way to do this?

I have the following code:
HTML:

<table id="hrm_search_attachment_list" class="display wrap" width="100%">
    <thead>
        <tr>
            <th></th>
            <th>FileName</th>
            <th>Type</th>
            <th>Filetype</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th></th>
            <th>FileName</th>
            <th>Type</th>
            <th>Filetype</th>
        </tr>
    </tfoot>
    <tbody id = 'hrm_result_att'>
        <tr>
            <td></td>
            <td>CV</td>
            <td>something1</td>
            <td>Senior Developer</td>
        </tr>
        <tr>
            <td></td>
            <td>CV2</td>
            <td>something</td>
            <td>Senior Developer</td>
        </tr>
    </tbody>
</table>

Javascript:

var hrm_attachment = $('#hrm_search_attachment_list').DataTable({      
        "lengthMenu": [
            [5, 10, 25, 50],
            [5, 10, 25, 50]
        ],
        columnDefs: [{
            orderable: false,
            className: 'select-checkbox',
            targets:   0
        }],
        select: {
            style:    'os',
            selector: 'td'
        },
    initComplete: function() {
        this.api().rows().select();
    },
        order: [[ 1, 'asc' ]]
});

santosh.sahoo@devoteam.com

You can find the code here jsFiddle

kthorngren

You can use the Select extension deselect event.

Kevin

santosh.sahoo@devoteam.com

Thanks @kthorngren

Thats exactly what I needed.

Here is the final javascript:

var hrm_attachment = $('#hrm_search_attachment_list').DataTable({     
        "lengthMenu": [
            [5, 10, 25, 50],
            [5, 10, 25, 50]
        ],
        columnDefs: [{
            orderable: false,
            className: 'select-checkbox',
            targets:   0
        }],
        select: {
            style:    'os-multi',
            selector: 'td'
        },
    initComplete: function() {
        this.api().rows().select();
    },
        order: [[ 1, 'asc' ]]
});

 
hrm_attachment.on( 'deselect', function ( e, dt, type, indexes ) {
    if ( type === 'row' ) {
        var data = hrm_attachment.rows( indexes ).data().pluck( 'id' );
        console.log(hrm_attachment.rows( indexes ).data());
        //console.log(dt.rows('.selected').data());
 
        // do something with the ID of the selected items
    }
    
} );