SharePoint 2013 - Excel Interactive View

In almost all custom web apps, as long as a html table returned, there is always the requirement to export the html table to an excel file for reporting purpose. Now SharePoint 2013 has a new feature simplified this and present the data in a popup window called Excel Interactive View.

All you need to add a link above your html table and include a script

I just insert a content editor web part into sharepoint page, then click the "edit html" to add the next code snippet.

<a href="#" name="MicrosoftExcelButton" data-xl-buttonStyle="Small" data-xl-tabletitle="My Table Title"></a>
<table>
   <tr><td>Name</td><td>Price</td><td>Group</td></tr>
   <tr><td>Orange</td><td>2</td><td>Fruit</td></tr>
   <tr><td>Apple</td><td>3</td><td>Fruit</td></tr>
   <tr><td>Cake</td><td>5</td><td>Desert</td></tr>
</table>
<script src="http://r.office.microsoft.com/r/rlidExcelButton?v=1&kip=1" type="text/javascript"></script>

After the page saved, it will be shown in browser like this

And if you click the links, a pop-up page will be shown to give you all the Excel functions such as filter and graphing.

However, if you click the link to show the view in IE8 on a Windows Server 2008 R2 environment, a javascript error is returned, which seems to do with un-supported property for JQuery running on IE8.

Instead, it runs well in Google Chrome.

If you use a different port number rather than 80 to browse in Chrome, you may have the following error,

Error 312: ERR_UNSAFE_PORT

You need to right-click the chrome icon to enter properties, and append the command arguments like,

--explicitly-allowed-ports=yourportnumber at the target.