locked
Javascript shows time format as 2019-04-11T14:00:00 and needs to be in 4/11/2019 1:00:00 PM format RRS feed

  • Question

  • User1045460610 posted

    My Javascript works but it shows time format as 2019-04-11T14:00:00 and needs to be in 4/11/2019 1:00:00 PM format. The time is displayed on the txtStartTime listed below. What's a good way to do that?

    <script type="text/javascript">
    function load() {
    var xhttp = new XMLHttpRequest();
    xhttp.open('post', 'instructorcourse.aspx/GetCourseTitles', true);
    xhttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    xhttp.setRequestHeader('Content-Type', 'application/json');
    xhttp.onreadystatechange = function () {
    if (xhttp.readyState == XMLHttpRequest.DONE && xhttp.status == 200) {
    var $titlesDropDown = document.getElementById('DropDownList1'),
    courses = JSON.parse(JSON.parse(this.responseText).d),
    html = '';
    //courses.forEach(function (course) {
    // var value = course.RecordID + '|' + course.CourseCode + '|' + course.Title;
    courses.forEach(function (course) {
    var value = course.RecordID + '|' + course.CourseCode + '|' + course.Title + '|' + course.StartTime;
    html += '<option value="' + value + '">' + course.Title + '</option>';
    });
    $titlesDropDown.innerHTML = html;
    }
    };
    xhttp.send(JSON.stringify({ instructorId: '<%=txtInstructorID.Text%>' }));
    }
    document.addEventListener('DOMContentLoaded', load);

    function changeCourse(e) {
    //var temp = e.target.value.split('|'),
    // //recordID = parseInt(temp[0]),
    // recordID = temp[0],
    // courseCode = temp[1],
    // title = temp[2];
    var temp = e.target.value.split('|'),
    //recordID = parseInt(temp[0]),
    recordID = temp[0],
    courseCode = temp[1],
    title = temp[2],
    startTime = temp[3];
    <%--document.getElementById('<%=nameof(txtInstructorID)%>').value = recordID;--%>
    document.getElementById('<%=nameof(txtRecordID)%>').value = recordID;
    document.getElementById('<%=nameof(txtCourseCode)%>').value = courseCode;
    document.getElementById('<%=nameof(txtCourseTitle)%>').value = title;
    document.getElementById('<%=nameof(txtStartTime)%>').value = startTime;
    }
    </script>

    Friday, April 12, 2019 7:44 PM

Answers

  • User1045460610 posted

    If I try this line I get the error in the Internet Explorer debugger Object doesn't support property or method 'toLocaleDateString'. Is there a way to write that function on one line?
    document.getElementById('txtStartTime').value = Date(startTime).toLocaleDateString() + ' ' + Date(startTime).toLocaleTimeString();

    It works in one line if I try this
    document.getElementById('<%=nameof(txtStartTime)%>').value = new Date(startTime).toLocaleDateString() + ' ' + new Date(startTime).toLocaleTimeString();

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, April 16, 2019 1:47 PM

All replies

  • User475983607 posted

    My Javascript works but it shows time format as 2019-04-11T14:00:00 and needs to be in 4/11/2019 1:00:00 PM format. The time is displayed on the txtStartTime listed below. What's a good way to do that?

    You misunderstand what happening.  The date format was manually generated on the server.  

    Convert the date string to a Date type in the JavaScript application.  From there you can use the JavaScript Date object to generate date and time strings as shown below.

    var d = new Date(startTime);
    document.getElementById('<%=nameof(txtStartTime)%>').value = d.toLocaleDateString() + ' ' + d.toLocaleTimeString(); 

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

    FYI, the code indicates that you are serializing and deserializing twice.  Generally, you don't want to do that.

    Friday, April 12, 2019 10:15 PM
  • User839733648 posted

    Hi Tom4IT,

    According to your description and code, I suggest that you could use moment.js to convert your date format.

    I've made a test and maybe you could refer to.

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js"></script>
        <script>
            var str = "2019-04-11T14:00:00+01:00";
            var testdate = moment.parseZone(str).utc().format("MM/DD/YYYY hh:mm:ss a");
            console.log(testdate);
        </script>
    </head>
    <body>
    
    </body>
    </html>

    result:

    Reference:http://momentjs.com/docs/#/manipulating/local/

    Best Regards,

    Jenifer

    Monday, April 15, 2019 6:50 AM
  • User1045460610 posted

    If I try this line I get the error in the Internet Explorer debugger Object doesn't support property or method 'toLocaleDateString'. Is there a way to write that function on one line?
    document.getElementById('txtStartTime').value = Date(startTime).toLocaleDateString() + ' ' + Date(startTime).toLocaleTimeString();

    It works in one line if I try this
    document.getElementById('<%=nameof(txtStartTime)%>').value = new Date(startTime).toLocaleDateString() + ' ' + new Date(startTime).toLocaleTimeString();

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, April 16, 2019 1:47 PM