Converting Json Date into mm/dd/yy format

Question

I am getting data from Json which also contains date. Now the date is displayed in Numerics. I were able to convert Date into a readable format but that's not my requirement. I want the date to be displayed in mm/dd/yy format.

$.ajax({
        url: '@Url.Action("ReqVacancy", "AdvertisementMaintenance")',
        type: 'GET',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: { "RequisitionID": id },
        success: function (data) {
              var result1 = "";
                divid.html('');
$.each(data, function (id, result) {
                    if (result != 0) {
                        var result1 = "<tr>"
                        + '<td><input type="checkbox" name="VacancyId"  id="VacancyId" value=' + result.VacancyId + '></td>'

                                            + "<td>" + result.VacancyId + "</td>"
                                            + "<td>" + result.PositionId + "</td>"
                                            + "<td>" + result.Reason + "</td>"
                                            + "<td>" + eval('new' + result.StartDate.replace(/\//g, ' ')) + "</td>"
                                            + "<td>" + eval('new' + result.EndDate.replace(/\//g, ' ')) + "</td>"
                                               + "<tr>"
                        $('#tbody').append(result1);
                    }


                });
      });

And the result goes here....

    VacancyId   Position    Reason         StartDate                                                EndDate
    1           Fresher      Not Avail     Sat Mar 07 2015 00:00:00 GMT+0530 (India Standard Time)  Tue Mar 17 2015 00:00:00 GMT+0530 (India Standard Time)

My requirement is:

VacancyId   Position         Reason        StartDate          EndDate
    1           Fresher      Not Avail      03/07/2015        03/17/2015

I could do the above taking a variable and then using getMonth(), getDate() and getFullYear(). But the code goes long and I have been asked to do it within a single line of code. Any help is highly appreciated. Thanks.

Answer 1

I just got the answer from @Moksh Shah & also @Guruprasad Rao. Thanks for your help. It look like this here..

$.each(data, function (id, result) {
                  console.log(result.StartDate);
                    if (result != 0) {
//I just had to use new Date(......) here
                        var endDate = new Date(eval('new' + result.EndDate.replace(/\//g, ' ')));
                        var formattedEDate = endDate.getMonth() + 1 + '/' + endDate.getDate() + '/' + endDate.getFullYear();
                        var SDate = new Date(eval('new' + result.StartDate.replace(/\//g, ' ')));
                        var formattedSDate = SDate.getMonth() + 1 + '/' + SDate.getDate() + '/' + SDate.getFullYear();
                        //console.log(endDate);
                        var result1 = "<tr>"
                        + '<td><input type="checkbox" name="VacancyId"  id="VacancyId" value=' + result.VacancyId + '></td>'

                                            + "<td>" + result.VacancyId + "</td>"
                                            + "<td>" + result.PositionId + "</td>"
                                            + "<td>" + result.Reason + "</td>"
                                            + "<td>" + formattedSDate + "</td>"
                                          + "<td>" + formattedEDate + "</td>"
                                               + "<tr>"
                        $('#tbody').append(result1);
                    }

Answer 2

It can be a possible duplicate of this

Your code should look like:

      if (result != 0) {
                    var result1 = "<tr>"
                    + '<td><input type="checkbox" name="VacancyId"  id="VacancyId" value=' + result.VacancyId + '></td>'

                                        + "<td>" + result.VacancyId + "</td>"
                                        + "<td>" + result.PositionId + "</td>"
                                        + "<td>" + result.Reason + "</td>"
                                        + "<td>" + dateFormat(result.StartDate) + "</td>"
                                        + "<td>" + dateFormat(result.EndDate) + "</td>"
                                           + "<tr>"
                    $('#tbody').append(result1);
                }


    function dateFormat(dateObject) {
          var d = new Date(dateObject);
          var day = d.getDate();
          var month = d.getMonth();
          var year = d.getFullYear();
          if (day < 10) {
           day = "0" + day;
          }
          if (month < 10) {
            month = "0" + month;
          }
          year = year.toString().slice(2);
          var date = day + "/" + month + "/" + year;

          return date;
      }

Answer 3

There's nothing to do with json for your date format, you can do something like this in javascript.

var startDate = new Date(result.StartDate);
var formattedStartDate = startDate.getMonth() + "/" + startDate.getDate() + "/" + startDate.GetYear();

Your overall code should look like this.

 $.each(data, function (id, result) {
        if (result != 0) {
            var startDate = eval('new' + result.StartDate.replace(/\//g, ' '));
            var formattedStartDate = startDate.getMonth() + "/" + startDate.getDate() + "/" + startDate.GetYear();
            var endDate = eval('new' + result.EndDate.replace(/\//g, ' '));
            var formattedEndDate = endDate.getMonth() + "/" + endDate.getDate() + "/" + endDate.GetYear();
            var result1 = "<tr>"
            + '<td><input type="checkbox" name="VacancyId"  id="VacancyId" value=' + result.VacancyId + '></td>'

                                + "<td>" + result.VacancyId + "</td>"
                                + "<td>" + result.PositionId + "</td>"
                                + "<td>" + result.Reason + "</td>"
                                + "<td>" + formattedStartDate + "</td>"
                                + "<td>" + formattedEndDate + "</td>"
                                   + "<tr>"
            $('#tbody').append(result1);
        }

Solution: 2

Create a prototype for date as :

Date.prototype.toMMDDYYYY = function(){
  return this.getMonth() + "/" + this.getDate() + "/" + this.getFullYear()
};

Use Case:

new Date().toMMDDYYYY();

In your screen:

$.each(data, function (id, result) {
            if (result != 0) {
               var result1 = "<tr>"
                + '<td><input type="checkbox" name="VacancyId"  id="VacancyId" value=' + result.VacancyId + '></td>'

                                    + "<td>" + result.VacancyId + "</td>"
                                    + "<td>" + result.PositionId + "</td>"
                                    + "<td>" + result.Reason + "</td>"
                                    + "<td>" + new Date(result.StartDate.replace(/\//g, ' ')).toMMDDYYYY()+ "</td>"
                                    + "<td>" + new Date(result.EndDate.replace(/\//g, ' ')).toMMDDYYYY()+ "</td>"
                                    + "<tr>"
                $('#tbody').append(result1);
            }

Update: with live example

//Somewhere globally...
Date.prototype.toMMDDYYYY = function(){
  return this.getMonth() + "/" + this.getDate() + "/" + this.getFullYear()
};

//expecing your date string looks like this

var startDate = new Date("Sat Mar 07 2015 00:00:00 GMT+0530 (India Standard Time)");
var data = [{"PositionId":1,"Reason":"Fresher","StartDate":"/Date(1425666600000)/","EndDate‌":"/Date(1426530600000)/","VacancyId":1}];
$.each(data, function (id, result) {
            if (result != 0) {
              //Your rest of the code
             alert( eval("new " + result.StartDate.replace(/\//g, ' ')).toMMDDYYYY());
            }
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 4

You can do like this

$.each(data, function (id, result) {
                    if (result != 0) {
                       var stDate=new Date(result.StartDate);
                       var endDate=new Date(result.EndDate);
                        var result1 = "<tr>"
                        + '<td><input type="checkbox" name="VacancyId"  id="VacancyId" value=' + result.VacancyId + '></td>'
                                            + "<td>" + result.VacancyId + "</td>"
                                            + "<td>" + result.PositionId + "</td>"
                                            + "<td>" + result.Reason + "</td>"
                                            + "<td>" + stDate.getMonth()+1 +"/" + stDate.getDate() + "/" + stDate.getFullYear()  + "</td>"
                                            + "<td>" + endDate.getMonth()+1 +"/" + endDate.getDate() + "/" + endDate.getFullYear()  + "</td>"
                                               + "<tr>"
                        $('#tbody').append(result1);
                    }


                });