Dojo Datagrid - 以编程方式设置选定行的样式答案

【问题标题】：Dojo Datagrid - Style selected row programmaticallyDojo Datagrid - 以编程方式设置选定行的样式
【发布时间】：2012-06-25 20:44:00
【问题描述】：

是否可以以编程方式设置 Datagrid 的选定行的样式？

谁能给个 sn-p ？

【问题讨论】：

标签： datagrid dojo dojox.grid dojox.grid.datagrid

【解决方案1】：

试试这个（这里是 a fiddle 修改后的参考指南示例）：

var grid = new dojox.grid.DataGrid({
    id: 'grid',
    store: store,
    structure: layout,
    rowSelector: '20px',
    onClick: function() {
        // ( selection.selected is array for multiple)
        var index = this.selection.selectedIndex,
        // typically 1 here, mess with it if nogo on solution
        viewindex = 1,
        RAWROWNODE = this.views.views[viewindex].rowNodes[index]

    }
}, document.createElement('div'));

您还可以查看网格组件使用的样式表。

.dojoxGridRow,
.dojoxGridRowOdd,
.dojoxGridRowSelected {
}

【讨论】：

确实解决方案是覆盖网格正在使用的 css。更具体地说，我使用 claro 主题和 claroGrid.css，我在里面更改了它：对于选定行：.claro .dojoxGridRowSelected .dojoxGridRowTable tr td[style] { background-color:#cee6fa !important; } 对于 Over Row： .claro .dojoxGridRowOver .dojoxGridCell { background:url("images/row_back.png") #ABD6FF repeat-x !important;边框顶部：1px 实心 #769DC0;边框底部：1px 实心 #769DC0; }

【解决方案2】：

为什么不简单地覆盖正确的 css 类？否则你可能想看看 onStyleRow 和 styleRowState 函数

【讨论】：

【解决方案3】：

试试这个

 dojo.connect(grid, 'onStyleRow', this, function (row) {
    if (grid.selection.selectedIndex == row.index) {
       row.customStyles += "color: red;";            
    }

    grid.focus.styleRow(row);
    grid.edit.styleRow(row);
});

【讨论】：