inline css is not showing in excel when exporting

Question

1.00/5 (1 vote)

See more:

I am trying to export html table with inline css but the problem is css is not showing (div inline css I want to show).
here is a snippet of my html table td

HTML

<td class="progressColorGrade empPK_32" ><div style="display : block; background-color:#00FF00">-</div></td>

while I am using this to export in excel

JavaScript

<pre lang="xml"><script type="text/javascript">
      var tableToExcel = (function () {
          var uri = 'data:application/vnd.ms-excel;base64,'
              , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>'
              , base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) }
              , format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }) }
          return function (table, name) {
              if (!table.nodeType) table = document.getElementById(table)
              var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }
              window.location.href = uri + base64(format(template, ctx))
          }
      })()
  </script>

Posted 23-Jun-15 20:34pm

Muhamad Faizan Khan

Updated 23-Jun-15 20:42pm

v2

Add a Solution

Comments

Suvendu Shekhar Giri 24-Jun-15 2:41am

There are two kinds of CSS has been applied to the markup you have shown here. The td element has internal/external css classes and div is appled with inline CSS. So, which style is not exporting to the excel, or both ?

Muhamad Faizan Khan 24-Jun-15 2:41am

hi thanks.. div inline css I want to show

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Muhamad Faizan Khan · Answer 1 · 2015-06-24T20:39:00

Finally i figured it out[^]. Using an embedded or external css style will not work.

Observations

CSS must be inline
CSS must be on th or td elements of the table because they represent CELLS in excel(This is what problem with me)
Colors should be HEX

SUMMARY From the above code, i dont need an external css style. All my css styles need to be inline in the table

There could be more to be observed. Please if you note any, please share!!!! Thanks.