Senin, 11 Desember 2017

IT : Export HTML To CSV Without Save

Untuk memakai fasilitas ini pastikan untuk nama table itu sama dengan yang di javascript

Javascript :
var xport = {
  _fallbacktoCSV: true, 
  toXLS: function(tableId, filename) {  
    this._filename = (typeof filename == 'undefined') ? tableId : filename;
   
    //var ieVersion = this._getMsieVersion();
    //Fallback to CSV for IE & Edge
    if ((this._getMsieVersion() || this._isFirefox()) && this._fallbacktoCSV) {
      return this.toCSV(tableId);
    } else if (this._getMsieVersion() || this._isFirefox()) {
      alert("Not supported browser");
    }

    //Other Browser can download xls
    var htmltable = document.getElementById(tableId);
    var html = htmltable.outerHTML;

    this._downloadAnchor("data:application/vnd.ms-excel" + encodeURIComponent(html), 'xls');
  },
  toCSV: function(tableId, filename) {
    this._filename = (typeof filename === 'undefined') ? tableId : filename;
    // Generate our CSV string from out HTML Table
    var csv = this._tableToCSV(document.getElementById(tableId));
    // Create a CSV Blob
    var blob = new Blob([csv], { type: "text/csv" });

    // Determine which approach to take for the download
    if (navigator.msSaveOrOpenBlob) {
      // Works for Internet Explorer and Microsoft Edge
      navigator.msSaveOrOpenBlob(blob, this._filename + ".csv");
    } else {     
      this._downloadAnchor(URL.createObjectURL(blob), 'csv');     
    }
  },
  _getMsieVersion: function() {
    var ua = window.navigator.userAgent;

    var msie = ua.indexOf("MSIE ");
    if (msie > 0) {
      // IE 10 or older => return version number
      return parseInt(ua.substring(msie + 5, ua.indexOf(".", msie)), 10);
    }

    var trident = ua.indexOf("Trident/");
    if (trident > 0) {
      // IE 11 => return version number
      var rv = ua.indexOf("rv:");
      return parseInt(ua.substring(rv + 3, ua.indexOf(".", rv)), 10);
    }

    var edge = ua.indexOf("Edge/");
    if (edge > 0) {
      // Edge (IE 12+) => return version number
      return parseInt(ua.substring(edge + 5, ua.indexOf(".", edge)), 10);
    }

    // other browser
    return false;
  },
  _isFirefox: function(){
    if (navigator.userAgent.indexOf("Firefox") > 0) {
      return 1;
    }
   
    return 0;
  },
  _downloadAnchor: function(content, ext) {
      var anchor = document.createElement("a");
      anchor.style = "display:none !important";
      anchor.id = "downloadanchor";
      document.body.appendChild(anchor);

      // If the [download] attribute is supported, try to use it
     
      if ("download" in anchor) {
        anchor.download = this._filename + "." + ext;
      }
      anchor.href = content;
      anchor.click();
      anchor.remove();
  },
  _tableToCSV: function(table) {
    // We'll be co-opting `slice` to create arrays
    var slice = Array.prototype.slice;

    return slice
      .call(table.rows)
      .map(function(row) {
        return slice
          .call(row.cells)
          .map(function(cell) {
            return '"t"'.replace("t", cell.textContent);
          })
          .join(",");
      })
      .join("\r\n");
  }
};


HTML:

<h1>Html table to excel or csv <small style="font-size:17px">---With export for IE and Edge</small></h1>

<p> Test1: <button id="btnExport" onclick="javascript:xport.toXLS('testTable');"> Export to XLS</button> <em>&nbsp;&nbsp;&nbsp;Export the table to XLS with CSV fallback for IE & Edge</em>
  </p>

<p>Test 2: <button id="btnExport" onclick="javascript:xport.toCSV('testTable');"> Export to CSV</button> <em>&nbsp;&nbsp;&nbsp;Export the table to CSV for all browsers</em>
  </p>

<p> Test3: <button id="btnExport" onclick="javascript:xport.toXLS('testTable', 'outputdata');"> Export to XLS</button> <em>&nbsp;&nbsp;&nbsp;Export the table to XLS with custom filename</em>
  </p>
<br />

Account:0201245680<br>Corporate:BCAAPI2016<br>token: Bearer 6T5lE877flvcFCAHXVLqa9nUvBFPLvlENFQKHWBbgfOuNttd80k6C3<br>isotime: 2017-12-12T08:38:40.320+01:00<br>signature: c0860f921e6daf88db49ccedd290f00033abd6d630ca7247df4017fc6809cbcd<br>API Key: 457d1f14-c199-47ec-b993-ae7d8d32ad74<br><br><table id="testTable" name="testTable" title="BCA contoh" border=solid>
<thead>
    <tr>      
        <th>TransactionDate</th>
        <th>BranchCode</th>
        <th>TransactionType</th>
        <th>TransactionAmount</th>
        <th>TransactionName</th>
        <th>Trailer</th>
   
    </tr>
  </thead>
  <tbody>
    <tr>
        <td>29/08</td>
        <td>0000</td>
        <td>D</td>
        <td>9000000.00</td>
        <td>TRSF E-BANKING DB</td>
        <td>2808/ACDFT/WS950519000000.00 REK KORAN DARI GIRO KE TAPRES</td>
    </tr>
    <tr>
        <td>29/08</td>
        <td>0000</td>
        <td>C</td>
        <td>25000.00</td>
        <td>TRSF E-BANKING CR</td>
        <td>08/28 95031 FOR CORPDUMMY1</td>
    </tr>
    <tr>
        <td>29/08</td>
        <td>0000</td>
        <td>D</td>
        <td>200000.00</td>
        <td>BA JASA E-BANKING</td>
        <td>2908/TRCHG/WS95051BIAYA TRANSFER SME</td>
    </tr>
    <tr>
        <td>29/08</td>
        <td>0000</td>
        <td>D</td>
        <td>1000000.00</td>
        <td>BYR VIA E-BANKING</td>
        <td>29/08  WSID95051  PENERIMAAN NEGARA 115110002341111</td>
    </tr>
    <tr>
        <td>29/08</td>
        <td>0061</td>
        <td>C</td>
        <td>900000.00</td>
        <td>SETORAN TUNAI</td>
        <td>PEMBUKAAN REK.</td>
    </tr>
    <tr>
        <td>30/08</td>
        <td>0000</td>
        <td>D</td>
        <td>10000.00</td>
        <td>BA JASA E-BANKING</td>
        <td>3008/TRCHG/WS95051BIAYA TRANSFER SME</td>
    </tr>
    <tr>
        <td>30/08</td>
        <td>0000</td>
        <td>D</td>
        <td>5000000.00</td>
        <td>TRSF E-BANKING DB</td>
        <td>3008/FTRTG/00001000110042 other bank TRANSFER VIA RTGS Dummy4</td>
    </tr>
    <tr>
        <td>30/08</td>
        <td>0000</td>
        <td>C</td>
        <td>70000000.00</td>
        <td>TRSF E-BANKING CR</td>
        <td>3008/FTSCY/WS95051 70000000.00 Ticket Payment DUMMY13</td>
    </tr>
    <tr>
        <td>30/08</td>
        <td>0061</td>
        <td>C</td>
        <td>5000000.00</td>
        <td>NK - LLG</td>
        <td></td>
    </tr>
    <tr>
        <td>30/08</td>
        <td>0998</td>
        <td>C</td>
        <td>800000.00</td>
        <td>SETORAN VIA CDM</td>
        <td>3008  WSID:Z9991  DUMMY16</td>
    </tr>
    <tr>
        <td>31/08</td>
        <td>0015</td>
        <td>C</td>
        <td>1000000.00</td>
        <td>NK - KU MASUK</td>
        <td></td>
    </tr>
    <tr>
        <td>31/08</td>
        <td>0000</td>
        <td>D</td>
        <td>30000.00</td>
        <td>BIAYA ADM</td>
        <td></td>
    </tr>
    <tr>
        <td>31/08</td>
        <td>0000</td>
        <td>C</td>
        <td>11100.00</td>
        <td>BUNGA</td>
        <td></td>
    </tr>
    <tr>
        <td>31/08</td>
        <td>0000</td>
        <td>D</td>
        <td>2220.00</td>
        <td>PAJAK BUNGA</td>
        <td></td>
    </tr>
    <tr>
        <td>PEND</td>
        <td>0000</td>
        <td>D</td>
        <td>100000.00</td>
        <td>TRSF E-BANKING DB</td>
        <td>0109/FTSCY/WS95051 100000.00 Online Transfer   PT DUMMY2</td>
    </tr>
    <tr>
        <td>PEND</td>
        <td>0061</td>
        <td>C</td>
        <td>3000000.00</td>
        <td>NK - LLG</td>
        <td></td>
    </tr>
    <tr>
        <td>PEND</td>
        <td>0000</td>
        <td>D</td>
        <td>250000.00</td>
        <td>TRSF E-BANKING DB</td>
        <td>0109/FTSCY/WS95051 250800.00 Transfer DUMMY1</td>
    </tr>
    <tr>
        <td>PEND</td>
        <td>0000</td>
        <td>D</td>
        <td>100000.00</td>
        <td>BA JASA E-BANKING</td>
        <td>0109/TRCHG/WS95051BIAYA TRANSFER SME</td>
    </tr>
    <tr>
        <td>PEND</td>
        <td>0101</td>
        <td>C</td>
        <td>10000.00</td>
        <td>KR OTOMATIS</td>
        <td>DUMMY7  039903811112</td>
    </tr>
    <tr>
        <td>PEND</td>
        <td>0038</td>
        <td>D</td>
        <td>100000.00</td>
        <td>TARIKAN TUNAI</td>
        <td></td>
    </tr>
  </tbody>
</table>

Tidak ada komentar:

Posting Komentar