开发者

TableTools only exporting single header row

I am using the DataTables jquery plugin

I have a DataTable that has multi-row table header with colspan. Something like:

<thead>
  <tr>
    <th>Level 1</th>
    <th colspan='2'>Level 1 - Item 1</th>
    <th colspan='2'>Level 1 - Item 2</th>
  </tr>
  <tr&开发者_StackOverflowgt;
    <th>Level 2</th>
    <th>Level 2 - Item 1a</th>
    <th>Level 2 - Item 1b</th>
    <th>Level 2 - Item 2a</th>
    <th>Level 2 - Item 2b</th>
  </tr>
</thead>

However when I use the TableTools plugin to export then except for the "Print" option all the rest (Excel, CSV, Pdf etc) only has the "Level 2" header row and not the Level 1.

Any suggestions on how to get it to export also Level 1?


If you want to export level1 also to excel, there is an alternative way:

Replace rowspan/colspan with empty cells like:

   <thead>
      <tr>
        <th>Level 1</th>
        <th>Level 1 - Item 1</th>
        <th></th>
        <th>Level 1 - Item 2</th>
        <th></th>
      </tr>
      <tr>
        <th>Level 2</th>
        <th>Level 2 - Item 1a</th>
        <th>Level 2 - Item 1b</th>
        <th>Level 2 - Item 2a</th>
        <th>Level 2 - Item 2b</th>
      </tr>
    </thead>

Then as suggested by @misiu above, Edit TableTools.js.
Find _fnGetDataTablesData and inside it change this:

if (oConfig.bHeader) { ... }

with this as:

if (oConfig.bHeader) {
    //another loop
    for (i = 0, rowCount = dt.nTHead.rows.length; i < rowCount; i++) {
        aRow = []; //clear row data
        for (j = 0, iLen = dt.aoColumns.length; j < iLen; j++) {
            if (aColumnsInc[j] && dt.nTHead.rows[i].children[j] !== null) {
                sLoopData = dt.nTHead.rows[i].children[j].innerHTML.replace(/\n/g, " ")
                    .replace(/<.*?>/g, "")
                    .replace(/^\s+|\s+$/g, "");
                sLoopData = this._fnHtmlDecode(sLoopData);
                aRow.push(this._fnBoundData(sLoopData, oConfig.sFieldBoundary, regex));
            } else {
                aRow.push(this._fnBoundData("", oConfig.sFieldBoundary, regex)); //I'm not shure of this!!
            }
        }
        aData.push(aRow.join(oConfig.sFieldSeperator));
    }
}

This will copy/export complex headers to csv/excel. Although empty table cells will remain empty in excel and will not be merged. You can manually merge them.

Though not an ideal solution, this worked perfectly for me for now.


Edit TableTools.js.
Find _fnGetDataTablesData and inside it change this:

if (oConfig.bHeader) {
    aRow = [];

    for (i = 0, iLen = dt.aoColumns.length; i < iLen; i++) {
        if (aColumnsInc[i]) {
            sLoopData = dt.aoColumns[i].sTitle.replace(/\n/g, " ")
                .replace(/<.*?>/g, "")
                .replace(/^\s+|\s+$/g, "");
            sLoopData = this._fnHtmlDecode(sLoopData);

            aRow.push(this._fnBoundData(sLoopData, oConfig.sFieldBoundary, regex));
        }
    }

    aData.push(aRow.join(oConfig.sFieldSeperator));
}

to this:

if (oConfig.bHeader) {

    //another loop
    for (i = 0, rowCount = dt.nTHead.rows.length; i < rowCount; i++) {
        aRow = []; //clear row data
        for (j = 0, iLen = dt.aoColumns.length; j < iLen; j++) {
            if (aColumnsInc[j] && dt.nTHead.rows[i].children[j] !== null) {
                sLoopData = dt.nTHead.rows[i].children[j].innerHTML.replace(/\n/g, " ")
                    .replace(/<.*?>/g, "")
                    .replace(/^\s+|\s+$/g, "");
                sLoopData = this._fnHtmlDecode(sLoopData);
                aRow.push(this._fnBoundData(sLoopData, oConfig.sFieldBoundary, regex));
            } else {
                aRow.push(this._fnBoundData("", oConfig.sFieldBoundary, regex)); //I'm not shure of this!!
            }
        }
        aData.push(aRow.join(oConfig.sFieldSeperator));
    }
}

I can't test this roght now, so give this a try.
I'll update my answer when I get better solution from Allan.


if ( oConfig.bHeader )
    {
        //-1 because we don't want the last row header
        for (i=0; i<dt.nTHead.rows.length-1; i++)
        {
            //wrap jquery object
            $(dt.nTHead.rows[i]).find('th').each(function(){
           var th = $(this);
           sData += th.text().replace(/\n/g," ").replace( /<.*?>/g, "" ).replace(/^\s+|\s+$/g,"");

           var colspan = th.attr('colspan');
           if (!colspan) colspan = 1; //default colspan is 1

           //only the first colspan have the label, other colspans are empty text, we can't implement cell mergin in csv file
           for (j=0; j<colspan; j++)
           {
                 sData += oConfig.sFieldSeperator;
           }
        });

        sData += sNewline;
        }

        for ( i=0, iLen=dt.aoColumns.length ; i<iLen ; i++ )
        {
            if ( aColumnsInc[i] )
            {
                sLoopData = dt.aoColumns[i].sTitle.replace(/\n/g," ").replace( /<.*?>/g, "" ).replace(/^\s+|\s+$/g,"");
                sLoopData = this._fnHtmlDecode( sLoopData );

                sData += this._fnBoundData( sLoopData, oConfig.sFieldBoundary, regex ) +
                    oConfig.sFieldSeperator;
            }
        }
        sData = sData.slice( 0, oConfig.sFieldSeperator.length*-1 );
        sData += sNewline;
    }


Take a look at this answer https://datatables.net/forums/discussion/22592/export-multiple-row-headers With this piece of code, you will be able to export all the cells from the header and the colspan and rowspans will be converted in empty cells :)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜