Get DOM element from cell() via KeyTable's "focused: true"
Get DOM element from cell() via KeyTable's "focused: true"
I have a table:
var table = $('#dataTable').DataTable({
"lengthMenu": [ [15, 30, 45, 60, -1], [15, 30, 45, 60, "All"] ],
"orderMulti": true,
"stateSave": true,
"pagingType": "full_numbers",
"autoWidth": false,
"pageLength": 15,
"dom": '<C<f><i><l><B<"clear">><p>rt>',
buttons: [
    {
        extend:    'copyHtml5',
        text:      '<i class="fa fa-copy"></i>',
        titleAttr: 'Copy'
    },
    {
        extend:    'excelHtml5',
        text:      '<i class="fa fa-file-excel"></i>',
        titleAttr: 'Excel'
    },
    {
        extend:    'csvHtml5',
        text:      '<i class="fa fa-file-alt"></i>',
        titleAttr: 'CSV'
    },
    {
        extend:    'pdfHtml5',
        text:      '<i class="fa fa-file-pdf"></i>',
        titleAttr: 'PDF'
    }
],
'keys': true
});
And a bit of jQuery for KeyTables:
table.on( 'key-focus', function () {
    // The cell, returns an API object, but I don't know how to get the DOM
    // element from this API object
    var cell = table.cell( { focused: true });
    // The node, returns the actual TD, seemingly as an object.
    // I can't seem to be able to do node.find('input'); though, it says
    // node.find is not a function, so I suspect it's not an actual DOM
    // element?
    var node = table.cell( { focused: true } ).node();
    // The data, returns raw HTML as a string
    var data = table.cell( { focused: true } ).data();
    // This doesn't work. Gives an error (node.find is not a function)
    console.log(node.find('input'));
});
I can't seem to be able to get the DOM element so I can do jQuery stuff on it with it. If I try to do stuff like this:
var node = table.cell( { focused: true } ).node();`
if (node.find('a')) {
    console.log("Cell has a link!");
};
I get an error: "node.find is not a function".
My end goal with this is to allow the user to navigate the table with the keyboard (this is possible now, by default), and if they are on a cell with a checkbox (the very first column is all checkboxes), allow them to press spacebar to check the checkbox.
I can't even seem to be able to detect what type of element is inside the cell!
This question has an accepted answers - jump to answer
Answers
The
cellis passed in as an argument to thekey-focusevent handler:Note that
cell()returns an API instance, you need to use one of the access methods such ascell().node()to give the node.Allan