table showing data out of range, js jquery

Question

I have a table which works as expected, show all the data that falls between start and end dates(please look on comments for more info). only issue I am having right now is when I click next button on a table, the table header moves dates to next week dates and shows the data for that week but also it shows the data from last week as well. what I needed was if it goes to next week date it should show data only for that week (no rows/data from last week).

//this is only an eg:

function test() {
  //this is the table header start date(in pic)6/4/17
  var test1 = document.getElementById("testing").innerHTML;

  //this is the table header close date(in pic)6/10/17
  var test2 = document.getElementById("testin").innerHTML;

  //this is the function if dates is between start and end its displays the data in a tabel
  function dateInRange(dbdates, start, end) {
    if (end >= dbdates && start <= dbdates) {
      return true;
    } else {
      return false;
    }
  }


  var columns = ['orange']
  var table = document.getElementById('tablet');

  for (var i = 0; i < (testvalues.length - 1); i = i + 5) { //looping all values from db
    if (dateInRange(testvalues[i + 2], test1, test2)) {

      var row = table.insertRow(-1);

      var cell1 = row.insertCell(-1);
      var cell2 = row.insertCell(-1);

      //more logic 

      //this is just an ex:
      //this is next button on table
      $("next").click(
        test();
      }

Without reading your code, I say you need to clear your table first then populate — Huangism, Jun 09 '17 at 15:36
You don't have any code in there that removes the previous data before adding new data. — Daniel Beck, Jun 09 '17 at 15:36
Daniel how can I d that, can you please guide me on how to start — david, Jun 09 '17 at 15:44

Peter Schweitzer Jr · Answer 1 · 2017-06-09T17:26:58.683

1

You need something like the following at the start of your dateInRange function:

function dateInRange(dbdates, start, end) {
    dbdates=Date(dbdates);
    start=Date(start);
    end=Date(end);
    //rest of function
}

This will allow you to do the Date comparison you are attempting. You could convert the values to Dates before passing them to the function but this keeps your code cleaner.

In regards to removing/replacing all the existing rows except for the header, a good solution is here: Delete all rows in an HTML table

edited Jun 09 '17 at 17:26

answered Jun 09 '17 at 16:22

Peter Schweitzer Jr

258
2
8

1

my function is working perfect , its just that when I click on next it keeps getting data from last week – david Jun 09 '17 at 16:36
1

Your function code as presented is not perfect; I tested it with different dates and it produced incorrect return values. – Peter Schweitzer Jr Jun 09 '17 at 17:27

score 0 · Answer 2 · answered Jun 09 '17 at 15:37

0

In order to compare dates, you need to tell Javascript your string is a date and not just a regular string.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

answered Jun 09 '17 at 15:37

sidewinder

682
4
9

score 0 · Answer 3 · answered Jun 09 '17 at 18:48

0

You should remove the data of table before for loop , try it:

$("#tablet tbody tr").remove();

answered Jun 09 '17 at 18:48

sergioBertolazzo

585
2
11
27

table showing data out of range, js jquery

3 Answers3