Подсчет записей в таблице с помощью Javascript

Я использую django для вывода списка количества автомобилей, проданных в определенном дилерском центре. (предполагается, что есть только красные и синие автомобили). Я разработал запрос таким образом, чтобы мы могли визуализировать автомобили на ежемесячном, еженедельном или ежегодном уровне. Данные в таблице будут меняться, поэтому я написал следующий код javascript для чтения таблицы, которая будет генерироваться каждый раз. Я также использовал пагинацию, чтобы включить только 10 на странице. Код просто читает то, что доступно на первой странице и возвращает 10 каждый раз, тогда как мне нужно, чтобы он рассматривал все страницы. Кто-нибудь может помочь

<script>
  function counter(){
    
    
    var j = 6; //j=6 is the column id for colour in my table , so I'm, directly using it
    var total = 0;
    var red= 0;
    var blue= 0;
    
    var table = document.getElementById("datatable");
    
    for (var i = 1, row; row = table.rows[i]; i++) 
    {
      
      var Row = document.getElementById("datatable").rows[i].cells[j].innerHTML;
      
      var colour = document.getElementById("datatable").rows[i].cells[j].innerHTML;
      
      //alert(document.getElementById("datatable").rows[i].cells[j].innerHTML);
      if (colour == "red")
      {
        red= red+ 1;
      }
      else if (colour== "blue")
      {
        blue= blue+ 1;
      
      }
      
    total = red+ blue;
    }
    
    document.getElementById("total_count").innerText = total;
    document.getElementById("red_count").innerText = red;
    document.getElementById("blue_count").innerText = blue;

    
  }
</script>

HTML в таблицу

<div class="menu">
      <table cellpadding="0" id="datatable" style="margin-top: 20px" style="margin-bottom:20px" class="table" >
      <thead>
        <tr class="text-light bg-dark">
          <th class="text-center" >Date</th>
          <th class="text-center" >Model</th>
          <th class="text-center" >CustomerName</th>
          <th class="text-center" >Mobile</th>
          <th class="text-center" >Adress</th>
          <th class="text-center" >Delivery</th>
          <th class="text-center" >Colour</th>
          
          
         
        </tr>
      </thead>
      <tbody>


        {% for obj in filter.qs %}
           <tr>
            
            <td class="text-center" >{{ obj.Date}}</td>
            <td class="text-center" >{{ obj.Model}}</td>
            <td class="text-center" >{{ obj.CustomerName}}</td>
            <td class="text-center" >{{ obj.Mobile}}</td>
            <td class="text-center" >{{ obj.Address}}</td>
            <td class="text-center" >{{ obj.Delivery }}</td>
            <td class="text-center" >{{ obj.Qa_Decision }}</td>

поскольку таблица с id 'datatable' существует, я предполагаю, что вы используете библиотеку DataTables

если вы не используете пагинацию таблиц данных на стороне сервера, вы можете получить доступ ко всем данным с помощью ссылки rows().data() https://datatables.net/reference/api/rows().data()

если вы используете таблицы данных на стороне сервера или даже не используете таблицы данных вы можете считать эти данные только в бэкенде (django), так как js не может получить доступ ко всем этим данным

Вернуться на верх