Saving to an HTML Table

You can save an individual sheet or a range of cells in a sheet to an HTML table in a file or stream if you need to display the sheet in a Web browser. This does not save the entire spreadsheet, only an individual sheet.

The HTML export saves as much of the formatting information or presentation-related settings as possible, depending on whether that information can be translated to an HTML element or attribute. The header cells are not saved out to XML; only the data area cells. If you have grouping turned on, only the data area of the sheet (not the grouping bar at the top, and not the group heading rows) is saved.

To save the sheet to an HTML table, use the SaveHtml methods of the SheetView class.

The HTML export methods will not work with client profiling.

To save a range of cells on a sheet to an HTML table, use the SaveHtmlRange methods of the SheetView class.

In the example below, notice that the entire file is in a single <TABLE> element and that each of the cells, both headings and data area, are translated to table cells. Heading cells are output as <TH> elements (table heading cells) and data area cells are output as <TD> elements (table data cells). All of the formatting information is preserved and kept as attributes in the table cell attributes. A set of <COLGROUP> elements (column groups) define the width of the columns in the table. The appearance of the spreadsheet is reproduced as closely as possible in HTML in this fairly simple organization.

For detailed specifications of the HTML elements and their attributes, refer to the World Wide Web Consortium (W3C) (http://www.w3.org) HTML 4.01 reference site (http://www.w3.org/TR/html4).

Using Code

Use the SaveHtml method.

Example

This example uses the SaveHtml method.

C#	Copy Code
fpSpread1.ActiveSheet.SaveHtml("C:\\testfiles\\FPSpread-SheetToHTML.html");

VB	Copy Code
FpSpread1.ActiveSheet.SaveHtml("C:\testfiles\FPSpread-SheetToHTML.html")

This gives the following result:

                  
<table cellspacing="0" cellpadding="0"
rules="all" border="1" style="border-width:1px;border-style:solid;width:548px;border-collapse:collapse;">

  <COLGROUP>

     <col width=49px>

     <col width=150px>

     <col width=300px>     <col width=49px>

   </COLGROUP>

   <tr style="height:20px;">

     <th style="background-color:#A9A9A9;"></th>

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">Artist</th>

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">Website</th>

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">id</th>

   </tr>

   <tr style="height:20px;">     <th align="center"
valign="middle" 

style="color:White;background-color:#A9A9A9;"></th>

     <td align="left" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">Aerosmith</td>

     <td align="left" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">http://www.aerosmith.com/detect.html</td>

     <td align="right" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">0</td>

   </tr>

   <tr style="height:20px;">

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;"></th>

     <td align="left" valign="top" style="color:Gray;background-color:#DCDCDC;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">Foreigner</td>

     <td align="left" valign="top" style="color:Gray;background-color:#DCDCDC;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">http://www.foreigneronline.com/</td>

     <td align="right" valign="top" style="color:Gray;background-color:#DCDCDC;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">1</td>

   </tr>

   <tr style="height:20px;">

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;"></th>

     <td align="left" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">Jimi Hendrix</td>

     <td align="left" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">http://www.jimi-hendrix.com/</td>

     <td align="right" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">2</td>

   </tr>

     <tr style="height:20px;">

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;"></th>

     <td align="left" valign="top" style="color:Gray;background-color:#DCDCDC;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">Pink Floyd</td>

     <td align="left" valign="top" style="color:Gray;background-color:#DCDCDC;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">http://www.pinkfloyd.com</td>

     <td align="right" valign="top" style="color:Gray;background-color:#DCDCDC;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">3</td>

   </tr>

   <tr style="height:20px;">

     <th align="center" valign="middle" style="color:White;background-color:#A9A9A9;"></th>

     <td align="left" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">The
Who</td>

     <td align="left" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">http://www.thewho.net/</td>

     <td align="right" valign="top" style="color:Gray;background-color:#F8F8FF;font-family:Arial;font-size:12pt;font-weight:normal;font-style:normal;text-decoration:none;">4</td>

   </tr>

</table>