使用Django导出动态表数据

时间:2019-04-09 14:32:21

标签: html django export

我有一个由屏幕抓屏代码生成的表格,该表格运行良好。我还向该表添加了过滤器(搜索栏,下拉列表和显示条目限制)。此外,我刚刚添加了一个导出按钮,当单击并将所有表数据传输到csv时,该按钮将起作用。唯一的缺点是,即使启用了过滤器,导出按钮也将导出整个表。例如,如果我将下拉列表设置为仅在表格中显示男性,并将结果限制为每页10个,则“导出”按钮将仅导出整个表格。

我在这里搜索了一段时间,但没有找到解决方法。发送帮助。

这是我的html

<div class="table-responsive-sm">
    <h2>The Law Society Solicitors</h2>
    <p>This is a table of the output of The Law Society Web Scraping Code: Juan S. Gonzalez Jr.</p>
    <div style="float:left" class= "col-sm-2">
      <input class="form-control" id="Input" type="text" placeholder="Search...">
    </div>
    <div class="table-title">
    </div>
    <div id="show" style="float:right" class="table-filter">
      <div class="col-lg-2">
        <div class="show-entries">
          <span>Show results</span>
          <select class="form-control" name="limit" id="maxRows">
            <option value="5000 ">Full Table</option>
            <option value="10">10</option>
            <option value="20">20</option>
            <option value="30">30</option>
          </select>
        </div>
      </div>
    </div>
    <center>
      <div class="col-sm-3">
        <div class="filter-group">
          <label>Desired Role</label>
          <select id="mylist" onchange="myFunction()" class="form-control" >
              <option>None</option>
              <option>Assistant</option>
              <option>Associate</option>
              <option>Compliance Officer for Finance and Administration</option>
              <option>Compliance Officer for Legal Practice</option>
              <option>Consultant</option>
              <option>Designated Partner</option>
              <option>Director</option>
              <option>Employee</option>
              <option>In-house Solicitor</option>
              <option>Locum</option>
              <option>Member</option>
              <option>Non-member Partner</option>
              <option>Partner</option>
              <option>Professional Support Lawyer</option>
              <option>Prosecutor</option>
              <option>Role not specified</option>
              <option>SRA-approved manager - Director</option>
              <option>SRA-approved manager - Member</option>
              <option>SRA-approved manager - Partner</option>
              <option>SRA-approved manager - Sole Practitioner</option>
          </select>
        </div>
      </div>
    </center>
  </div>
  <div id="Data">
      <table id="tlaw" class="table table-striped">
          <thead>
            <tr>
                <th>Solicitor</th>
                <th>Office</th>
                <th>Address</th>
                <th>Primary_Role</th>
                <th>Secondary_Role</th>
                <th>Other_Role</th>
                <th>Other_Role_1</th>
            </tr>
          </thead>
          <tbody id="tls_table">
            {% block content %}

            {% endblock %}
          </tbody>
      </table>
  </div>
</div>           

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button><a href="#" type="button" class="export">Export Table data into Excel</a></button>

js代码

//export js code
    $(document).ready(function() {

function exportTableToCSV($table, filename) {

  var $rows = $table.find('tr:has(td)'),


    tmpColDelim = String.fromCharCode(11), r
    tmpRowDelim = String.fromCharCode(0),

    colDelim = '","',
    rowDelim = '"\r\n"',

    csv = '"' + $rows.map(function(i, row) {
      var $row = $(row),
        $cols = $row.find('td');

      return $cols.map(function(j, col) {
        var $col = $(col),
          text = $col.text();

        return text.replace(/"/g, '""'); 

      }).get().join(tmpColDelim);

    }).get().join(tmpRowDelim)
    .split(tmpRowDelim).join(rowDelim)
    .split(tmpColDelim).join(colDelim) + '"';

  if (false && window.navigator.msSaveBlob) {

    var blob = new Blob([decodeURIComponent(csv)], {
      type: 'text/csv;charset=utf8'
    });

    window.navigator.msSaveBlob(blob, filename);

  } else if (window.Blob && window.URL) {        
    var blob = new Blob([csv], {
      type: 'text/csv;charset=utf-8'
    });
    var csvUrl = URL.createObjectURL(blob);

    $(this)
      .attr({
        'download': filename,
        'href': csvUrl
      });
  } else {
    var csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csv);

    $(this)
      .attr({
        'download': filename,
        'href': csvData,
        'target': '_blank'
      });
  }
}

$(".export").on('click', function(event) {
  // CSV
  var args = [$('#Data>table'), 'export.csv'];

  exportTableToCSV.apply(this, args);

});
});
</script>

我希望导出按钮能够与已经安装的过滤器一起很好地工作。

0 个答案:

没有答案