convert iso8601 date format to date object

281
January 07, 2018, at 2:22 PM

snippet of The date format received I want to display the date in an HTML table but unable to convert the iso8601 type date format to the date object.

$(document).ready(function(){
    var startDate;
    var formattedDate;
    var day;

    $(function(){
        $.ajax({
            url: "http://localhost:8080/employee/101",
            method: "Get",
            success: function(data,status){
                startDate = new Date(data.joinDate);
                day = startDate.dayOfWeek;
                console.log(startDate);
            }   
        });
    });

I get error : invalid date at "console.log(startDate);"

I also need to increment the date but stuck at converting the iso8601 format to a normal date object.

Answer 1

Since you have all it takes out of your employee/101 data response:

var data = { 
  dayOfMonth: 14, 
  monthValue: 11, // NOVEMBER, we need to -1 it since Date expects 0 based month value 
  year: 2017, 
} 
 
var dateObject = new Date(data.year, data.monthValue - 1, data.dayOfMonth); 
 
alert(dateObject)

On my locale:

Tue Nov 14 2017 00:00:00 GMT+0100 (Central Europe Standard Time)

And BTW startDate.dayOfWeek given startDate is a Date object, you cannot use dayOfWeek like you did.

Answer 2

Thank you for all the help. I finally made it work as below: I was able to display date, though I need a bit more modification to display day and month as ÝYY.But still I think it was good progress.

javascript:

<script type="text/javascript">
    $(document).ready(function(){
        var dateObj;
        $(function(){
            $.ajax({
                url: "http://localhost:8080/employee/101",
                method: "Get",
                success: function(data,status){
                    dateObj = new Date(data.joinDate.year,
                                       data.joinDate.monthValue - 1,
                                       data.joinDate.dayOfMonth);
                    console.log(dateObj);

                $('#timeTable th:not(:first-child)').each(function(){
                if($(this).attr('Id') === 'totalHours') return;
                $(this).text(dateObj.getDate()+'-'+dateObj.getMonth()+'-'+dateObj.getFullYear());
                dateObj.setDate(dateObj.getDate() + 1);
                }); 
            }
            });
        });
    });
</script>

my html table:

<table Id="timeTable" class="table table-bordered">
    <thead>
      <tr>
        <th>Projects</th>
        <th id="mon" style="width:100px"></th>
        <th id="tue" style="width:100px"></th>
        <th id="wed" style="width:100px"></th>
        <th id="thu" style="width:100px"></th>
        <th id="fri" style="width:100px"></th>
        <th id="sat" style="width:100px"></th>
        <th id="sun" style="width:100px"></th>
        <th id="totalHours" style="width:100px"></th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Task1</td>
        <td contenteditable='true'></td>
        <td contenteditable='true'>2</td>
        <td contenteditable='true'></td>
        <td contenteditable='true'>3</td>
        <td contenteditable='true'>4</td>
        <td contenteditable='true'> </td>
        <td contenteditable='true'> </td>
        <td contenteditable='true'> </td>
      </tr>
      <tr>
        <td contenteditable='true'>Task2</td>
        <td contenteditable='true' >5</td>
        <td contenteditable='true' >2</td>
        <td contenteditable='true' >2.5</td>
        <td contenteditable='true' >3</td>
        <td contenteditable='true' >4</td>
        <td contenteditable='true' > </td>
        <td contenteditable='true' > </td>
        <td contenteditable='true' > </td>
      </tr>
      <tr>
        <td>Task3</td>
        <td>5</td>
        <td>2</td>
        <td>2.5</td>
        <td>3</td>
        <td>4</td>
        <td> </td>
        <td> </td>
        <td> </td>
      </tr>
    </tbody>
  </table>
Rent Charter Buses Company
READ ALSO
PHP Post vs JavaScript Ajax Request

PHP Post vs JavaScript Ajax Request

I have been into web development with both client amd server side code, and have been using JavaScript Ajaxto receive and manipulate for data along with PHP scripts

297
React Redux app structure multiple roles

React Redux app structure multiple roles

I'm planning to do a SPA web app using react redux, I'm stuck at figuring out the right architect for the front end

261
How to embed a scribd viewer into GitHub markdown?

How to embed a scribd viewer into GitHub markdown?

I would like to embed a scribd document viewer into a GitHub READMEmd, but the snippet generated by scribd sharing directly into markdown doesn't render on either on iframe or script html tags:

381
JavaScript-updating multiple slider innerHTML

JavaScript-updating multiple slider innerHTML

I am making a table form where the user will adjust multiple sliders in the tableI want to update the value to be displayed on the screen for each slider

256