Как загрузить только требуемые данные в таблицу базы данных (HTML), используя JavaScript? - PullRequest
1 голос
/ 22 мая 2019

У меня проблемы с загрузкой данных из таблицы, которую я только хотел.У меня есть ejs файл, который извлекает данные и показывает их в виде таблицы.а затем я добавил input:search, которые выполняют поиск по данным в таблице и отображают только те строки, которые соответствуют строке в строке поиска.У меня уже есть эта кнопка download, которая загружает только всю таблицу, и мне нужно только загружать то, что показано в таблице, как только я использую панель поиска.

Я пытался искать в сети, но все, что я вижускачать для статических данных таблицы / без поискового запроса.это то, что я следовал о том, как загрузить таблицу в файл xls https://www.codexworld.com/export-html-table-data-to-excel-using-javascript/

это мой index.ejs

<input class="form-control" id="myInput" type="text" placeholder="Search..">
<hr>
<div class="tableFixHead">
  <% if(details!=null) { %>
    <table class="text-center table table-striped table-hover table-dark table-fixed">
      <thead>
        <tr class="table-primary" style="color:black; font-weight:bold;">
          <th scope="col">Route</th>
          <th scope="col">Origin </th>
          <th scope="col">Destination</th>
          <th scope="col">Estimated Time of Arrival </th>
          <th scope="col">Date </th>
          <th scope="col">Time</th>
        </tr>
      </thead>
      <% details.forEach(function(item){ %>
        <tbody id="myTable">

          <tr>
            <td>
              <%= item.route%>
            </td>
            <td>
              <%= item.origin %>
            </td>
            <td>
              <%= item.destination%>
            </td>
            <td>
              <%= item.estimatedTimeOfArrival %>
            </td>
            <td>
              <%= item.date%>
            </td>
            <td>
              <%= item.time%>
            </td>
          </tr>
        </tbody>
        <% }) %>
    </table>
    <% } %>

</div>
<button onclick="exportTableToCSV('data.csv')">Download Table</button>
</div>

это код, который фильтрует таблицу в поисковом запросе

$(document).ready(function() {
  $("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $("#myTable tr").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });
});

Я ожидаю, что как только я использую панель поиска, и она показывает только те данные, которые мне нужны, после того, как я нажму кнопку загрузки, будет загружаться только показанные данные, а не все данные в таблице.

например, я ищу номер 1 в таблице, он будет отображать только все данные, которые имеют номер 1, и это то, что я только хотел загрузить, но случай после нажатия download включает всеномер не просто 1 Заранее спасибо.

...