I'm using the aui library to make a sortable datatable. I would like the cells to be selectable (normally, plain text, no javascript event binding).
With columns
defined as
var columns = [
{
key: "col1",
label: "Column 1",
sortable: true
},
{
key: "col2",
label: "Column 2",
sortable: true
},
...
];
If I use something like
var myDatatable = new A.DataTable.Base({
columnset : columns,
recordset : data
});
I can select individual rows but there is no sorting.
If I use
var myDatatable = new A.DataTable({
columnset : columns,
recordset : data
});
The table is sortable but I can't select the data with a normal mouse press + drag.
What am I missing here?
I have tried adding the following plugins
plugins: [{
cfg: {
type: "rows"
},
fn: A.Plugin.DataTableHighlight
},
{
cfg: {
selectRow: true,
selectColumn: true
},
fn: A.Plugin.DataTableSelection
}]
but no luck with a plain simple select. For reference, the aui documentation is here. Note that the basic example does what I need minus sort and the real-world example requires double clicking (with editing allowed) on the cells to be able to select / copy the contents.
Please help. Thanks!
I managed to solve it after rendering the table by purging mousedown and mouseup events and overriding the getEditor
function and the sorting still works.
/* text is not selectable otherwise */
myDatatable.get("contentBox").purge(true, "mousedown");
myDatatable.get("contentBox").purge(true, "mouseup");
/* suppress getEditor */
A.DataTable.prototype.getEditor = function() {};