Table-to-Slides default for un-styled tables is black text on black bkgd

[orpitadutta]

I implemented table to slides but each time a black band appears. Can you please help? Or assist me where am i going wrong?

Presentation (1).pptx

Name	Test	Company

[gitbrent]

Hi @orpitadutta ,

Could you please attach a screencap instead and provide the code you're using?

Thanks.

[orpitadutta]

<title>DEMO</title> <script src="nextgen/jquery.min.js"></script> <script src="nextgen/jszip.min.js"></script> <script src="nextgen/filesaver.min.js"></script> <script src="nextgen/pptxgen.js"></script> <script src="nextgen/pptxgen.shapes.js"></script>

<table id="mytable">
    <thead>
        <tr>
            <th>Name</th>
            <th>Test</th>
            <th>Company</th>
        </tr>
    </thead>
</table>
<input type="button" value="Export to PPTX"
       onclick="{ var pptx = new PptxGenJS(); pptx.addSlidesForTable('mytable'); pptx.save(); }">

[alagarrk]

Hi @orpitadutta ,

I think, you need to apply some styles for the table. Currently table - background color is black & also text color is black. So you are seeing black box. @gitbrent Please correct me if i am wrong.

Ex:

Name	Test	Company

@orpitadutta Please try it

[orpitadutta]

@alagarrk Thanks a lot, It worked but i am unable to change the background of table. Can u please help?

[orpitadutta]

I tried this:

<script type="text/javascript"> function fnppt() { var tabOpts = { x:0.5, y:2.0, w:9.0, fill:'F7F7F7', font_size:18, color:'6f9fc9' }; var pptx = new PptxGenJS(); pptx.addSlidesForTable('mytable',tabOpts ); pptx.save(); } </script>

Name	Test	Company

<input type="button" value="Export to PPTX" onclick="fnppt()">

[alagarrk]

@orpitadutta , For addSlidesForTable() - Reproduces an HTML table - background colors, borders, fonts, padding, etc.

So you can add styles using css. For Ex:
#mytable {
background: #f2f2f2;
border: 1px solid black;
color: black;
}

#mytable th,
#mytable tr {
    background: #f2f2f2;
}

Please check this

[orpitadutta]

@alagarrk Thnxx a lot it worked like a charm..

[gitbrent]

Hi @orpitadutta @alagarrk ,

Thanks for your help on this Issue.

Turns out that the default color returned by jQuery is black, so in un-styled tables, you end up with black text on a black background...

I've updated the code to detect this condition and default to a white background instead.

[Strawberry0215]

hi @gitbrent is it possible for addTable to call it on it's ID instead of var array?