YUI Column Selection

Question

I'm having issues using YUI's DataTable Column Selection Functionality. I've tried,

myEndColDataTable.subscribe("theadCellClickEvent", myEndColDataTable.onEventSelectColumn);

and

myEndColDataTable.subscribe("cellClickEvent", function (oArgs) { this.selectColumn(this.getColumn(oArgs.target)); });

The issue is, I have an initial column selected programmatically. I can highlight the other column, but it doesn't remove the selection from the initially-selected column.

Gavin Brock · Answer 1 · 2010-03-05T06:33:24.380

1

You are correct - there is no quick clean solution.

YUI DataTable currently (as of 2.8) lacks an unselectAllColmns method to match unselectAllRows (which is called by onEventSelectRow).

It is also worth noting that onEventSelectColumn selects the column header, so unselectAllCells will not work.

You could implement your own unselectAllColumns() function like this:

function unselectAllColumns (dataTable) {
        var i, oColumn, oColumnSet = dataTable.getColumnSet();
        for (i=0; i<oColumnSet.keys.length; i++) {
                oColumn = oColumnSet.keys[i];
                if (oColumn.selected) {
                        dataTable.unselectColumn(oColumn);
                }
        }
}

This will be marginally more efficient than using getSelectedColumns() because you will not need to build an intermediate array of only selected columns (looking at the source getSelectedColumns calls getColumnSet and walks the array just as above).

edited Mar 05 '10 at 06:33

answered Mar 03 '10 at 00:04

Gavin Brock

5,027
1
30
33

I looked at the row select example, and have it working, in a previous step. I tried those methods already, and they work, except for the fact that they don't unselect the previously-selected column when I select a new column. I tried the slight variation you had on your first example too, but it just doesn't work. Next step, I'm now trying to get the column index of the selected column and put it into a div, kind of like document.getElementById('lastColumn').innerHTML=myEndColDataTable.getSelectedColumns(); but it returns an array. – ctrygstad Mar 03 '10 at 19:19
You are correct - looking at the source, the selectColumn() code is only half implemented, when compared to select row. I rewrote the answer. – Gavin Brock Mar 05 '10 at 06:34

score 0 · Answer 2 · edited Dec 29 '11 at 20:27

0

I guess I can do this, but its not elegant. There has to be a better way.

myEndColDataTable.subscribe("cellClickEvent", function (oArgs) {
    var colUnSelect = myEndColDataTable.getSelectedColumns();
    myEndColDataTable.unselectColumn(colUnSelect[0]);
    myEndColDataTable.selectColumn(myEndColDataTable.getColumn(oArgs.target));  
});

edited Dec 29 '11 at 20:27

sjngm

12,423
14
84
114

answered Mar 02 '10 at 20:53

ctrygstad

131
1
3
11

YUI Column Selection

2 Answers2