How to get current date and time in a specific format using javascript-CodePudding

Hi guys I'm new to JavaScript. I'm trying to get the Date and Time in a non-editable textbox in this format: (e.g. 7 October 2022 Friday 10:47). The content is the current date or today’s date which will change every day.

Currently these are my codes:

function getDate()
        {
        
            const date = new Date();
            
            const months = [ "January",
                            "February",
                            "March",
                            "April",
                            "May",
                            "June",
                            "July", 
                            "August",
                            "September",
                            "October",
                            "November",
                            "December" ];
                            
             const days = [ "Monday",
                            "Tuesday", 
                            "Wednesday",
                            "Thursday", 
                            "Friday", 
                            "Saturday"
                            "Sunday" ];
            
            
            document.getElementById("dateandtime").value = months[(date.getMonth() 1)]   (date.getFullYear())   days[(date.getDay())]   (date.getHours())   ':'  (date.getMinutes());
                        
        }

        Current Date and Time: 
        <br/>
        <input type = "text" id = "dateandtime" name = "dateandtime" onl oad="getDate()" readonly>
        <br/><br/>

However, when I run it, nothing is displayed in my textbox.

Any idea why that is the case?

CodePudding user response：

JavaScript has a window onl oad event to launch certain functions whenever a web page is loaded.

window.onload = function() { /* code here */ }

Your code should look like:

window.onload = function() {
  const date = new Date();
            
            const months = [ "January",
                            "February",
                            "March",
                            "April",
                            "May",
                            "June",
                            "July", 
                            "August",
                            "September",
                            "October",
                            "November",
                            "December" ];
                            
             const days = [ "Monday",
                            "Tuesday", 
                            "Wednesday",
                            "Thursday", 
                            "Friday", 
                            "Saturday",
                            "Sunday"];
            
            
            document.getElementById("dateandtime").value = months[(date.getMonth() 1)]   (date.getFullYear())   days[(date.getDay())]   (date.getHours())   ':'  (date.getMinutes());
};

CodePudding user response：

Here is my solution:

function getNow() {
  let now = new Date();
  let option = {
    year: 'numeric',
    month: 'long',
    day: 'numeric'
  };
  let dateFormatter = new Intl.DateTimeFormat('en-GB', option);
  let weekDayFormatter = new Intl.DateTimeFormat('en-GB', {
    weekday: "long"
  });
  let timeFormatter = new Intl.DateTimeFormat('en-GB', {
    hour: 'numeric',
    minute: 'numeric'
  });
  let dateString = dateFormatter.format(now);

  return (dateString   " "   weekDayFormatter.format(now)   " "   timeFormatter.format(now));
}

document.addEventListener("DOMContentLoaded", function(event) {
  document.getElementById("dateandtime").value = getNow();
});

<input type="text" id = "dateandtime" name = "dateandtime" readonly>