Javascript Displaying/Formatting Current Date and Time in Month Name & AM/PM Format

Please visit my new Web Site https://coderstechzone.com

Javascript provides us the ability to format and print Date and Time of visitor local computer for our application level UI. A lot of builtin Javascript Date and Time function will help us to do this. Since Javascript won't provide us the builtin format function so that we have to write custom function to meet our client requirement. Here i will fisrt show that how we can print or display current Date & Time. After that i will show the ways how we can format Date & Time by using two custom helper function. So lets start:

Print or Displaying the 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

document.write("Today's date is: " + nCurrentDay + "/" + nCurrentMonth + "/" + nCurrentYear);
</script>

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)
</script>

Format Current Date(Month Name) & Time(AM/PM):

Format function to get Month:

<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];
}
</script>

Funtion for displaing Time in AM/PM Format:

<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;
}

Now our custom javascript function is ready. You can easily modify the format by using the above way. The GetMonthName() custom function will help you to write any month name in textual format. So if you want 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.