Javascript 如何使用ExtJs rowexpander展开或折叠所有行？

我已经看到了其他类似问题的答案，但我无法找到任何可行的解决方案。例如，一种解决方案是计算网格中的记录，并通过调用expandRow（rowNumber）循环每个记录。但是，我在ExtJs 4.2中使用的rowexpander没有此功能。

我想出了一个解决方案：

expandAll: function (expand) {
    expand = typeof expand !== 'undefined' ? expand : true;

    var grid = this,
        store = grid.getStore(),
        rowExpander = grid.plugins[0],
        nodes = rowExpander.view.getNodes();

    for (var i = 0; i < nodes.length; i++) {
        var node = Ext.fly(nodes[i]);

        if (node.hasCls(rowExpander.rowCollapsedCls) === expand) {
            rowExpander.toggleRow(i, store.getAt(i));
        }
    }
},

expandAll:函数（扩展）{
expand=typeof expand！=“未定义”？expand:true；
var grid=此，
store=grid.getStore（），
rowExpander=grid.plugins[0]，
nodes=rowExpander.view.getNodes（）；
对于（var i=0；i

---

我猜选择插件不是正确的方法，但我不知道正确的方法。

我想出了一个解决方案：

expandAll: function (expand) {
    expand = typeof expand !== 'undefined' ? expand : true;

    var grid = this,
        store = grid.getStore(),
        rowExpander = grid.plugins[0],
        nodes = rowExpander.view.getNodes();

    for (var i = 0; i < nodes.length; i++) {
        var node = Ext.fly(nodes[i]);

        if (node.hasCls(rowExpander.rowCollapsedCls) === expand) {
            rowExpander.toggleRow(i, store.getAt(i));
        }
    }
},

expandAll:函数（扩展）{
expand=typeof expand！=“未定义”？expand:true；
var grid=此，
store=grid.getStore（），
rowExpander=grid.plugins[0]，
nodes=rowExpander.view.getNodes（）；
对于（var i=0；i

---

我猜选择插件不是正确的方法，但我不知道正确的方法。

我扩展了Benjaminunningham的解决方案，并添加了一个helper函数。 代码被设置为独立函数，所以您可以在需要的地方使用它们

接受2个参数：网格对象：Ext.getCmp（'gridId'）或任何网格引用 ：布尔值表示展开：true表示展开全部，false表示折叠

function getRowExpander(plugins){
var plugin;
  var length = plugins.length;
  for(var i =0; i < length; i++){
     if(plugins[i].ptype == 'rowexpander'){
        plugin = plugins[i];
        i = length; // ghetto loop exit
         }
   }
return plugin;
}

function toggleAll(grid, expand){
    expand = typeof expand !== 'undefined' ? expand : expand;


        var rowExpander = getRowExpander(grid.plugins);
        var nodes = rowExpander.view.getNodes();

        var length = nodes.length;
    for (var i = 0; i < length; i++) {
        var node = Ext.fly(nodes[i]);

        if (node.hasCls(rowExpander.rowCollapsedCls) === expand) {
            rowExpander.toggleRow(i, grid.store.getAt(i));
        }
    }
}

函数getRowExpander（插件）{
var插件；
var length=plugins.length；
对于（变量i=0；i

我扩展了Benjaminunningham的解决方案并添加了一个helper函数。 代码被设置为独立函数，所以您可以在需要的地方使用它们

接受2个参数：网格对象：Ext.getCmp（'gridId'）或任何网格引用 ：布尔值表示展开：true表示展开全部，false表示折叠

function getRowExpander(plugins){
var plugin;
  var length = plugins.length;
  for(var i =0; i < length; i++){
     if(plugins[i].ptype == 'rowexpander'){
        plugin = plugins[i];
        i = length; // ghetto loop exit
         }
   }
return plugin;
}

function toggleAll(grid, expand){
    expand = typeof expand !== 'undefined' ? expand : expand;


        var rowExpander = getRowExpander(grid.plugins);
        var nodes = rowExpander.view.getNodes();

        var length = nodes.length;
    for (var i = 0; i < length; i++) {
        var node = Ext.fly(nodes[i]);

        if (node.hasCls(rowExpander.rowCollapsedCls) === expand) {
            rowExpander.toggleRow(i, grid.store.getAt(i));
        }
    }
}

函数getRowExpander（插件）{
var插件；
var length=plugins.length；
对于（变量i=0；i

首先，我们不需要为每个都设置

，只需要设置plugin
id
并通过id获取它：

   plugins: [{
      ptype: 'rowexpander',
      pluginId: 'rowexpander',
      selectRowOnExpand: true,
      //.....
      //..... 
      expandRow: function(rowIdx) {
          var rowNode = this.view.getNode(rowIdx),
              row = Ext.get(rowNode),
              nextBd = Ext.get(row).down(this.rowBodyTrSelector),
              record = this.view.getRecord(rowNode),
              grid = this.getCmp();
          if (row.hasCls(this.rowCollapsedCls)) {
              row.removeCls(this.rowCollapsedCls);
              nextBd.removeCls(this.rowBodyHiddenCls);
              this.recordsExpanded[record.internalId] = true;
              this.view.fireEvent('expandbody', rowNode, record, nextBd.dom);
          }
      },

      collapseRow: function(rowIdx) {
          var rowNode = this.view.getNode(rowIdx),
              row = Ext.get(rowNode),
              nextBd = Ext.get(row).down(this.rowBodyTrSelector),
              record = this.view.getRecord(rowNode),
              grid = this.getCmp();
          if (!row.hasCls(this.rowCollapsedCls)) {
              row.addCls(this.rowCollapsedCls);
              nextBd.addCls(this.rowBodyHiddenCls);
              this.recordsExpanded[record.internalId] = false;
              this.view.fireEvent('collapsebody', rowNode, record, nextBd.dom);
          }
      }
  }],

现在，可以轻松展开/折叠所有行：

   var rowExpander = grid.getPlugin("rowexpander")
   //we can use as:
   rowexpander.expandRow(rowIndex);
   //or
   rowexpander.collapseRow(rowIndex);
   //or use for each
   var nodes = rowExpander.view.getNodes()
   for (var i = 0; i < nodes.length; i++) {
        rowExpander.collapseRow(i);
   }

var rowExpander=grid.getPlugin（“rowExpander”）
//我们可以使用：
rowexpander.expandRow（rowIndex）；
//或
rowexpander.collapseRow（rowIndex）；
//或分别使用
var nodes=rowExpander.view.getNodes（）
对于（var i=0；i
首先，我们不需要为每个

都设置

，只需要设置plugin
id
并通过id获取它：

   plugins: [{
      ptype: 'rowexpander',
      pluginId: 'rowexpander',
      selectRowOnExpand: true,
      //.....
      //..... 
      expandRow: function(rowIdx) {
          var rowNode = this.view.getNode(rowIdx),
              row = Ext.get(rowNode),
              nextBd = Ext.get(row).down(this.rowBodyTrSelector),
              record = this.view.getRecord(rowNode),
              grid = this.getCmp();
          if (row.hasCls(this.rowCollapsedCls)) {
              row.removeCls(this.rowCollapsedCls);
              nextBd.removeCls(this.rowBodyHiddenCls);
              this.recordsExpanded[record.internalId] = true;
              this.view.fireEvent('expandbody', rowNode, record, nextBd.dom);
          }
      },

      collapseRow: function(rowIdx) {
          var rowNode = this.view.getNode(rowIdx),
              row = Ext.get(rowNode),
              nextBd = Ext.get(row).down(this.rowBodyTrSelector),
              record = this.view.getRecord(rowNode),
              grid = this.getCmp();
          if (!row.hasCls(this.rowCollapsedCls)) {
              row.addCls(this.rowCollapsedCls);
              nextBd.addCls(this.rowBodyHiddenCls);
              this.recordsExpanded[record.internalId] = false;
              this.view.fireEvent('collapsebody', rowNode, record, nextBd.dom);
          }
      }
  }],

现在，可以轻松展开/折叠所有行：

   var rowExpander = grid.getPlugin("rowexpander")
   //we can use as:
   rowexpander.expandRow(rowIndex);
   //or
   rowexpander.collapseRow(rowIndex);
   //or use for each
   var nodes = rowExpander.view.getNodes()
   for (var i = 0; i < nodes.length; i++) {
        rowExpander.collapseRow(i);
   }

var rowExpander=grid.getPlugin（“rowExpander”）
//我们可以使用：
rowexpander.expandRow（rowIndex）；
//或
rowexpander.collapseRow（rowIndex）；
//或分别使用
var nodes=rowExpander.view.getNodes（）
对于（var i=0；i