Javascript Current Date Time and Formatting Month Name And Time in AM PM

Javascript provides us the ability to format and print local Date and Time. A lot of built in Javascript Date and Time function will help us to do this. Since Javascript won’t provide us the built in format function so that we have to write custom function to meet our client requirement. Here i will show that how we can print or display current Date & Time, after that the ways how we can format Date & Time by using two custom helper function. So lets start:

Print or Displaying Javascript Current Date and Time:
Displaying Current Date:

<script type="text/javascript">
    var dCurrentDate = new Date();
    var nCurrentDay = dCurrentDate.getDate();
    var nCurrentMonth = dCurrentDate.getMonth();
    var nCurrentYear = dCurrentDate.getFullYear();

    if (nCurrentDay < 10)
    nCurrentDay = "0" + nCurrentDay

    if (nCurrentMonth < 10)
    nCurrentMonth = "0" + nCurrentMonth

    // You can change the order of Day Month Year from below line 
    document.write("Today's date is: " + nCurrentDay + "/" + nCurrentMonth + "/" + nCurrentYear+"<br/>");

Displaying Current Time:

<script type="text/javascript">
    var dCurrentTime = new Date()
    var nCurrentHour = dCurrentTime.getHours()
    var nCurrentMinute = dCurrentTime.getMinutes()

    if (nCurrentHour < 10)
        nCurrentHour = "0" + nCurrentHour

    if (nCurrentMinute < 10)
        nCurrentMinute = "0" + nCurrentMinute

    document.write("Today's time is: " + nCurrentHour + ":" + nCurrentMinute+"<br/>")

Javascript Custom Function to Get Textual Month Name:

<script type="text/javascript">
function GetMonthName(nMonth)
    var MonthNames = new Array(12);
    MonthNames[0] = "January";
    MonthNames[1] = "February";
    MonthNames[2] = "March";
    MonthNames[3] = "April";
    MonthNames[4] = "May";
    MonthNames[5] = "June";
    MonthNames[6] = "July";
    MonthNames[7] = "August";
    MonthNames[8] = "September";
    MonthNames[9] = "October";
    MonthNames[10] = "November";
    MonthNames[11] = "December";

    return MonthNames[nMonth];

How to Invoke:

    document.write("Month Name is: "+GetMonthName(new Date().getMonth())+"<br/>");

Javascript Custom Function to Format Time in AM PM:

<script type="text/javascript">
    function GetTimeWithAMPM(nHour,nMinute)
        var AMPM = "AM";
        if (nHour >= 12)
                AMPM = "PM";
                nHour = nHour - 12;
        if (nHour == 0)
            nHour = 12;

        if (nHour < 10)
            nHour = "0" + nHour;

        if (nMinute < 10)
            nMinute = "0" + nMinute;

        return nHour + ":" + nMinute + " " + AMPM;

How to Invoke:

    document.write("Time format is: "+GetTimeWithAMPM(new Date().getHours(),new Date().getMinutes())+"<br/>");

Sample Output in Google Chrome:

Now you get the custom javascript function and its use by code example. You can easily modify the Date & Time format by using the above 2 functions. The GetMonthName() custom function will help you to write any month name in textual format. So if you want to get short month name then modify this function by the short month name. The GetTimeWithAMPM() custom function will take two arguments. One is hour & another one is minute. The parameter hour is the key to identify the format for AM/PM. Hope now you can format the Date & Time as per requirement.

Script tested for:
1. Internet Explorer
2. Mozilla Firefox
3. Opera
4. Google Chrome

Download Code Example Javascript

Posted in Client, Javascript

Leave a Reply

Your email address will not be published. Required fields are marked *