Export Html Table To Excel Spreadsheet

 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link
      href="https://unpkg.com/bootstrap@3.3.2/dist/css/bootstrap.min.css"
      rel="stylesheet"
    />
    <style>
      table {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
      }

      td,
      th {
        border: 1px solid #dddddd;
        text-align: left;
        padding: 8px;
      }
    </style>
    <title>Document</title>
  </head>
  <body style="margin: 100px">
    <div class="row">
      <div class="col-md-2">
        <a class="btn btn-default" id="export-btn">Export</a>
      </div>
      <div class="col-md-10"></div>
    </div>

    <table
      id="resultsTable"
      data-tableName="Test Table 2"
      class="table table-bordered"
    >
      <thead>
        <tr class="noExl">
          <td>This shouldn't get exported</td>
          <td>This shouldn't get exported either</td>
          <td>This shouldn't get exported either</td>
        </tr>
        <tr style="background-color: #dddddd ;">
          <th>Company</th>
          <th>Contact</th>
          <th>Country</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>Alfreds Futterkiste</td>
          <td>Maria Anders</td>
          <td>Germany</td>
        </tr>
        <tr>
          <td>Centro comercial Moctezuma</td>
          <td>Francisco Chang</td>
          <td>Mexico</td>
        </tr>
        <tr>
          <td>Ernst Handel</td>
          <td>Roland Mendel</td>
          <td>Austria</td>
        </tr>
        <tr>
          <td>Island Trading</td>
          <td>Helen Bennett</td>
          <td>UK</td>
        </tr>
        <tr>
          <td>Laughing Bacchus Winecellars</td>
          <td>Yoshi Tannamuri</td>
          <td>Canada</td>
        </tr>
      </tbody>
      <tfoot>
        <tr>
          <td>Magazzini Alimentari Riuniti</td>
          <td>Giovanni Rovelli</td>
          <td>Italy</td>
        </tr>
      </tfoot>
    </table>
  </body>
  <script src="https://unpkg.com/jquery@3.3.1/dist/jquery.min.js"></script>
  <script src="https://unpkg.com/bootstrap@3.3.2/dist/js/bootstrap.min.js"></script>
  <script src="https://cdn.rawgit.com/rainabba/jquery-table2excel/1.1.0/dist/jquery.table2excel.min.js"></script>
  <script>
    jQuery(document).ready(function () {
      $("#export-btn").on("click", function (e) {
        e.preventDefault();
        ResultsToTable();
      });

      function ResultsToTable() {
        $("#resultsTable").table2excel({
          exclude: ".noExl",
          name: "Results",
          filename:"Demo.xls",
          preserveColors:true
        });
      }
    });
  </script>
</html>


Comments