Introduction
Here, I am writing a short tip for auto update Date in Hindi with ASP.NET and JavaScript.
In this tip, we will see the detailed mechanism adopted to load dynamic HTML data in web Page with Asynchronous mode, thanks to Ajax.
Background
This tip may be useful for intermediate developers who have some basics in HTML, JQuery, JavaScript
Using the Code
Tools used in each scenario are:
- Visual Studio 2015
- jQuery JavaScript Library
- Bootstrap
JavaScript Code
<script type="text/javascript">
function updateClock() {
var currentTime = new Date();
var currentHours = currentTime.getHours();
var currentMinutes = currentTime.getMinutes();
var currentSeconds = currentTime.getSeconds();
currentMinutes = (currentMinutes < 10 ? "0" : "") + currentMinutes;
currentSeconds = (currentSeconds < 10 ? "0" : "") + currentSeconds;
var timeOfDay = (currentHours < 12) ? "पूर्वाह्न" : "अपराह्न";
currentHours = (currentHours > 12) ? currentHours - 12 : currentHours;
currentHours = (currentHours == 0) ? 12 : currentHours;
var monthNames = ["जनवरी", "फरवरी", "मार्च", "अप्रैल", "मई", "जून", "जुलाई",
"अगस्त", "सितम्बर", "अक्तूबर", "नबम्बर", "दिसंबर"];
var date = new Date();
var day = date.getDate();
var monthIndex = date.getMonth();
var year = date.getFullYear();
var d = day + ', ' + monthNames[monthIndex] + ' ' + year
var currentTimeString = d + " II " + currentHours + ":" + currentMinutes + ":"
+ currentSeconds + timeOfDay + " (भारतीय मानक समय)";
$('.time-info span').html(currentTimeString);
}
</script>
HTML Code
<form id="main_form" enctype="multipart/form-data" runat="server">
<div class="time-info"><span> </span></div>
</form>
CSS Code
.time-info {
float:left;
font-size:12px;
padding:5px;
}
.time-info span{
color:#fff;
}
The result will be:
Summary
I hope that you appreciated my effort. Thank you for viewing my post, try the source code and do not hesitate to leave your questions and comments.