выбор строки с помощью таблицы данных Liferay AUI

У меня есть сильное подозрение, что это не «правильный» способ сделать это, однако мне удалось изолировать DOM-узел строки, нажимаемой на этот код.

<aui:script use="datatable,datatable-sort,datatable-scroll,datatable-highlight,datatable-selection,liferay-portlet-url">
        var roleColumns = [ {
            label : 'Providing Role Name',
            key : 'providerRoleName',
            sortable : true,
            allowHTML : true,
            formatter : function(o) {
                var renderURL = Liferay.PortletURL
                        .createURL('<%= productDetailUrl %>');
                renderURL.setParameter('productId', o.data.productId);
                return '<a href="' + renderURL.toString() + '">'
                        + o.data.providerRoleName + '</a>';
            }
        }, {
            label : 'Cardinality',
            key : 'cardinality',
            sortable : true
        } ];

        new A.DataTable({
            columns : roleColumns,
            rowSelect: 'mousedown',
            data : <%=renderRequest.getAttribute("roles")%>,
            scrollable : "xy",
            height : "400px",
            width : '100%',
            sort : 'true',
            highlightRows : true
        }).plug(A.Plugin.DataTableSelection, {
            selectRow : true
        }).render('#productsTable');

        A.delegate('click', function(e) {
            console.log(e.currentTarget.getDOMNode());
        }, '#productsTable', 'tr', myDataTable); 

    </aui:script>

Все то же самое, кроме моего добавления внизу

A.delegate('click', function(e) {
    console.log(e.currentTarget.getDOMNode());
}, '#productsTable', 'tr', myDataTable); 

Вы также можете изолировать набор данных

A.delegate('click', function(e) {
    console.log(e.currentTarget.getData("yui3-record"));
}, '#productsTable', 'tr', myDataTable); 

Цель этого упражнения состояла в том, чтобы разрешить отображение основных и подробных сведений на одной и той же странице, где подробные сведения изменяются при выборе строки в основной таблице. Я решил поместить переключатель в первый столбец таблицы, как показано ниже, и щелчок по переключателям вызывает метод действия в портлете для обновления выбора строки и связанных деталей.

var columns = [
    {
        label : ' ',
        sortable : false,
        allowHTML : true,
        formatter : function(o) {
        if (o.data.isSelected)
            return '<img src="/html/icons/radiobutton-checked.png" width="15" height="15" border="0" />';
        var renderURL = Liferay.PortletURL.createURL('<%= partnerDetailUrl %>');
        renderURL.setParameter('productLineItemRoleId', o.data.id);
        return '<a href="' + renderURL.toString() + '"><img src="/html/icons/radiobutton-unchecked.png" width="15" height="15" border="0" /></a>';
    }
},
....
];

Я понимаю, что лучшим решением является использование javascript для динамического обновления только определенных частей страницы, а не для выполнения сообщения формы с каждым щелчком переключателя. Но это пока работает, и я могу перейти к более насущным вопросам ;).

Спасибо, Рэнди.