How to organize loading of records keeping sorting by date?

• 0
  Hello! There is a way to download records.
  
  

  -1 September
  --Record
  --Record
  --Record
  -2 September
  --Record
  --Record

  
  
  Initially, only 10 records are loaded, how can you load more records so that the date is not duplicated? Those. if on September 2, 10 records, initially only 5 were loaded, when you click on the button, load the remaining 5 records into the existing block with this date, and the remaining 5 have already been loaded into the blocks with their date?
  
  

  $.ajax({
      url: '../ajax/money.php',
      type: "GET",
      dataType: "json",
      success: function(json) {
          if (typeof(json.response) == 'object') {
              const _account = json.response.items.reduce((acc, cur, i, a) => {
                  const index = acc.findIndex(item => item.date === cur.date)
                  if (index !== -1) {
                      acc[index].accounts.push({
                          account: cur.account,
                          time: cur.time,
                          category: cur.category,
                          subcategory: cur.subcategory,
                          comment: cur.comment,
                          types: cur.type,
                          amount: cur.amount,
                          balance: cur.balance
                      })
                  } else {
                      cur.accounts = []
                      cur.accounts.push({
                          account: cur.account,
                          time: cur.time,
                          category: cur.category,
                          subcategory: cur.subcategory,
                          comment: cur.comment,
                          types: cur.type,
                          amount: cur.amount,
                          balance: cur.balance
                      })
                      acc.push(cur)
                  }
                  return acc
              }, [])
              $('div.timeline').html(_account.map(item => {
                  let div = `<div class="time-label"><span class="bg-primary">${item.date}</span></div>`
                  item.accounts.forEach(_item => {
                      div += `              <div>
                  ${_item.types}
                  <div class="timeline-item">
                    <span class="float-right" style="padding: 5px 10px 5px 5px;">${_item.amount}</span>
  				  <h3 class="timeline-header">${_item.account}</h3>
                    <div class="timeline-body"><small class="float-right">${_item.time}</small><b>${_item.category} / ${_item.subcategory}</b><br>${_item.comment}</div>
                  </div>
                </div>`
                  })
                  return div;
              }).join(''));
          } else {
              toastr.error('Некорректный json-ответ.');
          }
      },
      error: function() {
          toastr.error('Ошибка выполнения запроса.');
      }
  });

  JavaScript Molly Carson, Jul 19, 2019

---

0 Answers