0

我想选择一个网格行（HtmlElement）并尝试在其上应用 css 类。但无法在 extjs 4 中选择网格中的行。

我在 checkboxSelectionModel 模式上选择了一行，并希望添加/删除 cls。在 1.X extjs 中，代码是这样的；

function UncheckCheckHeader(control)
{
var grid=<%=grdForms.ClientID%>;
var hd =Ext.get(grid.getView().getHeaderCell(0).childNodes[0]); 

var store = grid.store; 

if(store.getCount()== control.getCount()) 
{
if(!hd.hasCls('x-grid3-hd-checker-on'))
{
hd.addCls('x-grid3-hd-checker-on');
}
}
else
{
if(hd.hasCls('x-grid3-hd-checker-on'))
{
hd.removeCls('x-grid3-hd-checker-on');
}
}
}

和标题点击是：

<HeaderClick Fn="function(ct, column, e, t, eOpts )
                                             {    debugger;                  
                                                if(column.getIndex() == 0)
                                                {
                                                  var hd = Ext.fly(e.target.parentNode);

                                                  var isChecked = hd.hasCls('x-grid3-hd-checker-on');
                                                  var showSelectedOn=false;
                                                  if(!showSelectedOn)
                                                  {
                                                    if(isChecked)
                                                    {
                                                      selectionHeaderChecked=true;
                                                      #{checkSelectionModel}.setLocked(false);
                                                      #{checkSelectionModel}.selectAll();
                                                      #{checkSelectionModel}.setLocked(true);
                                                    }
                                                    else
                                                    {
                                                      selectionHeaderChecked=false;
                                                      #{checkSelectionModel}.setLocked(false);
                                                      #{checkSelectionModel}.deselectAll();
                                                      #{checkSelectionModel}.setLocked(true);
                                                    }  
                                                 }
                                                 else
                                                 {
                                                    if(!selectionHeaderChecked)
                                                    {
                                                      hd.addCls('x-grid3-hd-checker-on');
                                                    }
                                                    else
                                                    {
                                                      hd.removeCls('x-grid3-hd-checker-on');
                                                    }
                                                  }         
                                                }                                                                                    
                                              }" />

我有一个带有 CheckBoxSelectionModel 的 ExtJs 网格。选中标题复选框会选中所有记录，取消选中复选框会取消选中所有记录，这当然是行为。我的网格有一个删除按钮来删除选定的/所有记录，并且工作正常。

现在我的问题是，当我选中标题处的复选框（以便选择整个记录）并点击我的删除按钮时，网格中的所有记录都将被删除。但是，列标题中的复选框选择仍保持选中状态。

我使用了代码：grid.getSelectionModel().DeSelectAll(); 清除选择，删除后。我猜，此代码仅适用于网格中的记录，与列标题部分无关。有什么办法，我可以取消选择标题中的复选框？

经过详细调查，我惊讶地发现 CheckBoxSelectionModel 中显示的复选框不是 html 复选框，而是图像。所以我使用 DOM 概念取消选中复选框的想法不能在这里应用。相反，必须做一些 CSS 技巧。

以前有人遇到过这样的问题吗？有什么解决办法吗？任何帮助将不胜感激。谢谢！

4

2 回答 2

0

我们可以做很多事情，请参考下面

var summaryRow = grid.getView().getFeature(0); 
styleObj = {
     'background-color': '#c5c5c5'  
 };
summaryRow.view.el.setStyle(styleObj);

或者

var summaryRow = grid.getView();
styleObj = {
         'background-color': '#c5c5c5'  
};
summaryRow.addRowCls(<index>, styleObj);

谢谢。

于 2013-06-19T10:47:50.837 回答
0

我的理解：您想根据选择添加和删除 css。您可以使用：

  grid.getView().addRowCls(rowindex, "yourCssClass" );

并使用以下方法删除您的 css：

grid.getView().removeRowCls("rowindex","yourCssClass");

您可以在selectiononchange和取消选择网格的事件侦听器中使用上面的内容。如何使用它们取决于您。谢谢。

于 2013-06-19T11:32:04.703 回答