How to match a date between given date difference in JavaScript

Question

I have a script that calculates the number of weeks between two given dates.

and then creates a table where number of row equals number of weeks .

script looks like this

Script

$('#test').click(function () {

    // Here are the two dates to compare
    var date1 = '29-10-2015';
    var date2 = '29-12-2015';
    var Targetvalue = parseFloat("1000000");
        var dealjson = '[{"dealdate":"25-11-2015","cost":200000}]';

    // First we split the values to arrays date1[0] is the year, [1] the month and [2] the day
    date1 = date1.split('-');
    date2 = date2.split('-');

    // Now we convert the array to a Date object, which has several helpful methods
    date1 = new Date(date1[2], date1[1], date1[0]);
    date2 = new Date(date2[2], date2[1], date2[0]);

    // We use the getTime() method and get the unixtime (in milliseconds, but we want seconds, therefore we divide it through 1000)
    date1_unixtime = parseInt(date1.getTime() / 1000);
    date2_unixtime = parseInt(date2.getTime() / 1000);

    // This is the calculated difference in seconds
    var timeDifference = date2_unixtime - date1_unixtime;

    // in Hours
    var timeDifferenceInHours = timeDifference / 60 / 60;

    // and finaly, in days :)
    var timeDifferenceInDays = timeDifferenceInHours / 24;
    var timeDifferenceInWeeks = Math.round(timeDifferenceInDays / 7);
    // alert(timeDifferenceInDays/7);
    TargetPerweek = Targetvalue / timeDifferenceInWeeks;
    //Math.round(timeDifferenceInWeeks);
    TargetPerweek = Math.round(TargetPerweek * 100) / 100;
    var string = "<table data-role='table' class='ui-responsive'><thead><tr><th>Week</th><th>Target</th><th>Achieved</th></tr></thead>";
    for (var i = 1; i <= timeDifferenceInWeeks; i++)
    string = string + "<tr><th>Week" + i + "</th><td>" + TargetPerweek + "</td><td></td></tr>";

    string = string + "</table>";
    $('.varianceData').html(string);

});

HTML

<button id="test">See the Tab</button>
<div class="varianceData"></div>

If you click the button in the fiddle you will see a table with Target and achieved value week wise .

So I want to show the achieved on the respective week he did the deal

Based on the variable dealjson so in the achived column I should show the amount that was achieved in the respective week ;

Expected Out put based on the dealjson

<table data-role="table" class="ui-responsive">
    <thead>
        <tr>
            <th>Week</th>
            <th>Target</th>
            <th>Achieved</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>Week1</th>
            <td>111111.11</td>
            <td>No Deal</td>
        </tr>
        <tr>
            <th>Week2</th>
            <td>111111.11</td>
            <td>No Deal</td>
        </tr>
        <tr>
            <th>Week3</th>
            <td>111111.11</td>
            <td></td>
        </tr>
        <tr>
            <th>Week4</th>
            <td>111111.11</td>
            <td>No Deal</td>
        </tr>
        <tr>
            <th>Week5</th>
            <td>111111.11</td>
            <td>200000</td>
        </tr>
        <tr>
            <th>Week6</th>
            <td>111111.11</td>
            <td></td>
        </tr>
        <tr>
            <th>Week7</th>
            <td>111111.11</td>
            <td>No Deal</td>
        </tr>
        <tr>
            <th>Week8</th>
            <td>111111.11</td>
            <td>No Deal</td>
        </tr>
        <tr>
            <th>Week9</th>
            <td>111111.11</td>
            <td>No Deal</td>
        </tr>
    </tbody>
</table>

@ManProgrammer using the `dealJson` if the dates from the variable matches the week its falling in then I should show the `cost' else I should show `No deal ` — Vikram Anand Bhushan, Oct 14 '15 at 07:24
For comparing dates, you should take a look at http://stackoverflow.com/a/493018/3207406 — oliverpool, Oct 14 '15 at 07:28

score 1 · Accepted Answer · answered Oct 14 '15 at 08:11

1

You can use setDate() to increase the number of date1 7 days, until it becomes equal to or greater than date2. And compare the deal dates using simple >= && <=, to check if the dates is within the week, you will need a temporary variable. Here is the updated fiddle. Its not optimized, but it works.

answered Oct 14 '15 at 08:11

Akshendra Pratap

2,002
1
12
25

So now IF i have more number of achived values in Json it should work right ? – Vikram Anand Bhushan Oct 14 '15 at 09:12
1

Yes the code in the fiddle should work for an array of deals in dealjson. – Akshendra Pratap Oct 14 '15 at 09:13
actually in Target week wise should be Target/totalweek can you tell me how i can do that here – Vikram Anand Bhushan Oct 14 '15 at 09:27
1

You can use an array of achieved values and create the to be appended string outside the loop, when you have the achieved values and the number of weeks. Or you just find the number of weeks in the way you did earlier. – Akshendra Pratap Oct 14 '15 at 09:32
one Last thing Can you please add thelogic to make one table month wise and day wise . I tried but I am not able to do it. – Vikram Anand Bhushan Oct 14 '15 at 09:41
For days you can change the number of days being added to 1. Doing this for months is bit trickier, you can follow [this post](http://stackoverflow.com/questions/499838/javascript-date-next-month) . If you can use a library, then [Datejs](http://www.datejs.com/) will help. – Akshendra Pratap Oct 14 '15 at 09:50
@AkshendraPratab I tried with multiple json data but its not working , Please check this fiddle http://jsfiddle.net/k2pkv17a/6/ – Vikram Anand Bhushan Oct 14 '15 at 10:07
25-10-2015 does not come within the specified does, try 29-10-2015 – Akshendra Pratap Oct 14 '15 at 10:10
I am sorry I think wrong data in my Database , I will try to build for day wise and month wise , I have to show all this in a graph so Can You suggest something Please – Vikram Anand Bhushan Oct 14 '15 at 10:13
1

I have not used a JS charting library myself but there are tons of them. One that I have heard a lot about is [Chart.js] (http://www.chartjs.org/), take a look. – Akshendra Pratap Oct 14 '15 at 10:31
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/92248/discussion-between-vikram-and-akshendra-pratap). – Vikram Anand Bhushan Oct 14 '15 at 10:59

How to match a date between given date difference in JavaScript

1 Answers1