闫振

博客园 首页 联系 订阅 管理

官方Demo地址:http://examples1.ext.net/#/GridPanel/Miscellaneous/Export_Data_PostBack/

该例子的明显的缺点是:导出的Excel中包含里所有Store中的数据,而且表头默认为了Store中的name属性..而我们真实项目中往往只需要导出Grid中显示出来的数据,同时表头也要跟Grid中的一样.

经过百度哥和自己的研究对官方代码进行修改:

1.JS中的saveData方法修改:

var saveData = function () {
    // 获取gridpanel中所有的行
    var rows = GridRK.getRowsValues({ selectedOnly: false });
    if (!rows || typeof (rows) != 'object' || rows.length < 1)
        return false;
    var topRcd = rows[0];
    var hdrRcd = new Array();
    var notExistedInGrid = new Array();
    // 添加header至尾部
    for (field in topRcd) {
        fieldIndex = GridRK.colModel.findColumnIndex(field);
        if (fieldIndex < 0) {
            notExistedInGrid.push(field);
            continue;
        }
        header = GridRK.colModel.getColumnHeader(fieldIndex);
        hdrRcd.push(header);
    }
    // 移除grid中未显示的数据
    for (var i = 0; i < rows.length; i++) {
        var row = rows[i];
        for (var j = 0; j < notExistedInGrid.length; j++) {
            var field = notExistedInGrid[j];
            delete row[field];
        }
    }
    rows.push(hdrRcd);
    //首尾调换
    var temp = rows[rows.length - 1];
    rows[rows.length - 1] = rows[0];
    rows[0] = temp;
    GridData.setValue(Ext.encode(rows));
};

 

2.删除.xsl文件中默认设置表头的部分

<Row>
  <xsl:for-each select="*[position() = 1]/*">
    <Cell>
      <Data ss:Type="String">
        <xsl:value-of select="local-name()" />
      </Data>
    </Cell>
  </xsl:for-each>
</Row>

这样我们导出的数据就跟GridPanel中的数据完全一致了(包括表头).