JavaScript - Sorting Date & Time
Hi All,
I've done a few searches on it, but I can't seem to find the correct order for my date / time script. I have a field that returns the date/time in the following format: Y-m-d H:i:s (i.e. yyyy-mm-dd hh:mm:ss) What I want to do is rearrange this so that it says: 'dd' 'month-name' 'yyyy' at 'time' Anyone have any ideas? Thanks, Neil Similar TutorialsI am trying to use JavaScript in conjuntion with html to display a table of sortable cities, states and dates. The dates are my problem. I am a novice and was given this code. But it seems to sort in European style, yyyy/mm/dd. I need it to sort mm/dd/yyy, which i am told is US style. Any help on this, I would be most grateful for. I have placed a page here to let you see the code at work. This page has the code on it in text also. I do not mind posting the code hgere also if you prefer. Thanks for any help you may be willing to offer me with this. Preston Hi All. I have a dynamic Coldfusion form which adds multiple addresses which holds fields like Town, Postcode, ResidentFromDate, ResidentToDate... and on click of the save button I have a script function that runs which I am trying add all the elements of this form into an array and then sort by ResidentFromDate and output the results... Here is what I have at the minute but my sort does not seem to be working and is throwing out results in the following order (10/2006, 01/2005, 08/2006, 01/2007) and that is clearing not in descending order... If someone could take a look at my script and tell me what is wrong I would be much appreciated (see below) * I seem to be getting results and it is just not sorting correctly, so my theory is something is up with the part where I am calling addresses.sort. Code: var dates = { convert:function(d) { // Converts the date in d to a date-object. The input can be: // a date object: returned without modification // an array : Interpreted as [year,month,day]. NOTE: month is 0-11. // a number : Interpreted as number of milliseconds // since 1 Jan 1970 (a timestamp) // a string : Any format supported by the javascript engine, like // "YYYY/MM/DD", "MM/DD/YYYY", "Jan 31 2009" etc. // an object : Interpreted as an object with year, month and date // attributes. **NOTE** month is 0-11. return ( d.constructor === Date ? d : d.constructor === Array ? new Date(d[0],d[1],d[2]) : d.constructor === Number ? new Date(d) : d.constructor === String ? new Date(d) : typeof d === "object" ? new Date(d.year,d.month,d.date) : NaN ); }, compa function(a,b) { // Compare two dates (could be of any type supported by the convert // function above) and returns: // -1 : if a < b // 0 : if a = b // 1 : if a > b // NaN : if a or b is an illegal date // NOTE: The code inside isFinite does an assignment (=). return ( isFinite(a=this.convert(a).valueOf()) && isFinite(b=this.convert(b).valueOf()) ? (a>b)-(a<b) : NaN ); }, inRange:function(d,start,end) { // Checks if date in d is between dates in start and end. // Returns a boolean or NaN: // true : if d is between start and end (inclusive) // false : if d is before start or after end // NaN : if one or more of the dates is illegal. // NOTE: The code inside isFinite does an assignment (=). return ( isFinite(d=this.convert(d).valueOf()) && isFinite(start=this.convert(start).valueOf()) && isFinite(end=this.convert(end).valueOf()) ? start <= d && d <= end : NaN ); } } // define array var addresses = []; // if atAddrSince is greater than 5 years from today if (atAddrSince > addrFromValidate) { // loop round each previous address for (i=1;i<=maxID;i++) { var addrPart = []; if (eval('document.fmAddPrevAddr.address1'+i)) { var address1 = eval('document.fmAddPrevAddr.address1'+i+'.value'); var town = eval('document.fmAddPrevAddr.town'+i+'.value'); var country = eval('document.fmAddPrevAddr.country'+i+'.value'); var postcode = eval('document.fmAddPrevAddr.postcode'+i+'.value'); var residentfrom = eval('document.fmAddPrevAddr.ataddrsince'+i+'.value'); var residentto = eval('document.fmAddPrevAddr.ataddrto'+i+'.value'); // insert into array addrPart[0]=address1; addrPart[1]=town; addrPart[2]=country; addrPart[3]=postcode; addrPart[4]=residentfromdate; addrPart[5]=residenttodate; addresses.push(addrPart); } } addresses.sort(sortfunction) function sortfunction(a, b) { if(dates.compare(a[4],b[4]) == -1) { return true; } else { return false; } } for (var v=0;v<addresses.length;v++) { var addresses1 = addresses[v]; alert(addresses1[4]); } } Many Thanks, George hi, can some one help me how to get the time and date difference? given two time and date with the following format like in textbox A: 2011-05-03 17:35:47.0 and textbox B: 2011-05-03 16:35:47.0 then the output would be: 0 days, 1 hour, 0 minutes, 0 seconds regards, verve Hi. I am having a little trouble with the following code, I am unsure where the problem is I will start from the beginning. Let me know if this is correct. 1. asked to declare a variable named timeStr=to the value returned from the showDateTime() function. 2.declare a variable named mapNum equal to the value returned from the getMap() function. Code: <title>SkyWeb: The Planisphere</title> <link href="skyweb.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="datetime.js"></script> <script type="text/javascript"> function timestr(){ /* timestr is a text string containing the current date and time mapNum is the number of the map to display in the planisphere */ var timeStr=showDateTime(); var mapNum=getMap(); } </script> </head> It asks me to scroll down to the div element with the id value "maps" and replace the line <img id="sky" src="sky0.jpg" alt=""/> with a script element that writes the following code<img id='sky' src='skymapNum.jpg' alt='' /> where mapNum is the value of the mapNum variable. replace the date/time value "Jan 1 2007, 12:00 am" with a script element that writes the value of the timeStr variable to the web page. Code: <div id="maps"> <img id="sky" src="sky0.jpg" alt="" /> <img id="mask" src="mask.gif" alt="" /> <div id="datetime"> January 1, 2007, 12:00 am </div> </div> I have tried it several ways but have been unable to get this through my think head, I am new to JS the textbook isnt very explanitory as you guys have been. Thanks for your time. I have created a kdate.js file in Kannada to display current, day,month,date,year and time.While the day,month are displayed in kannada the date,year time are shown in english.I want them to display in Kannada.Will some one guide me how I can do this and what are changes that to make in the javascript code.I have used unicode while writing Kannada script. I also want to know how to increase and change font color and the time element to be displayed on the next line. Please help and guide me. thanks js file in the form the text is sent as an attachment. Hi guys, I have JavaScript code that displays the date, time and URL in the web page, here is the code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JavaScript Page One</title> </head> <body> <script type="text/javascript"> var today=new Date() var browser=navigator.appName; var b_version=navigator.appVersion; var version=parseFloat(b_version); document.write(''+today.toString()+'<br>'+window.location+'') document.write("<br />"); document.write("Browser name: "+ browser); document.write("<br />"); document.write("Browser version: "+ version); </script> </body> </html> How can i format it so that it uses the following colors for different date and time components: Day in red, Date in green, Month in yellow, Year in blue, Hours and Minutes in brown? And also, what is the JavaScript code to successfully display the number of forms, anchors and links in the page? Thanks ~Savage Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <script type="text/javascript"> var info = new Date() var day = info.getDate() var mon = info.getMonth() var year = info.getFullYear() var hour = info.getHours() var min = info.getMinutes() var sec = info.getSeconds() alert(day+","+mon+","+year+","+hour+","+min+","+sec+",") if (day>=22 && mon>=5 && year>=2011 && hour>=12 && min>=00 && sec>=00) { document.write{ <script src="//c.tadst.com/common/fullscreen2.js" type="text/javascript"></script><tr><td id="c1" align="center" valign="middle"><h2 align="center" class=c>Time <span id=el_u1>until</span> SUMMER HOLIDAYS </h2> <div align="center"> <table class=wa> <tbody id=rs3><tr><td><span id=el_d1>7</span> <span id=el_d1t>days</span>, <span id=el_h1>19</span> <span id=el_h1t>hours</span>, <span id=el_m1>58</span> <span id=el_m1t>minutes</span>, <span id=el_s1>18</span> <span id=el_s1t>seconds</span></td></tr></tbody></table> </div> <h2 align="center"><span class="c">that is</span></h2> <p align="center"><script type="text/javascript"> <!-- et=1308231902;function f0(d){return ld[d.getUTCDay()]+','+' '+d.getUTCDate()+'.'+' '+lm[d.getUTCMonth()]+' '+pf(d.getUTCFullYear(),4)+', '+p2(d.getUTCHours())+':'+p2(d.getUTCMinutes())+':'+p2(d.getUTCSeconds());} cks={el:{t:[{o:7200,a:'CEST',d:1}],f:f0,c:{t:1308736800E3}}}; lm=new Array();lm[5]='Juni';ld=new Array();ld[2]='Dienstag';ld[3]='Mittwoch';ld[4]='Donnerstag';//--> </script> </p> <div align="center"> <table class="wa"> <tbody id="rs1"> <tr> <td id="el_d2" class="r dbl">7</td> <td class="dbl"> </td> <td id="el_d2t" class="dbl">days</td> </tr> <tr> <td id="el_h2" class="r dbl">187</td> <td class="dbl"> </td> <td id="el_h2t" class="dbl">hours</td> </tr> <tr> <td id="el_m2" class="r dbl">11275</td> <td class="dbl"> </td> <td id="el_m2t" class="dbl">minutes</td> </tr> <tr> <td id="el_s2" class="r dbl">676517</td> <td class="dbl"> </td> <td id="el_s2t" class="dbl">seconds</td> </tr> </tbody> </table> <script src="//c.tadst.com/common/common21.js?5" type="text/javascript"></script> <script src="//c.tadst.com/common/wcupd8.js?1" type="text/javascript"></script> </div> }; } else { document.write{ <img src="happysummerholiday.jpg" width="285" height="200" /> }; } </script> </body> </html> The Red part is html coding. Doesn't seam to work - please help me. The idea is that after the date (22.06.2011 at 12:00) the content changes to the picture. Thank you in advanced for helping me Hi All, I wonder if you can help me with some time and date formatting in JS. I already use a neat date formatting JS script which is useful when a PERL script returns a date field of 'DATE' by converting it from yyyy-mm-dd to dd month(in text) yyyy: <script type = "text/javascript"> var months = ["January","February","March","April","May","June","July","August","September","October","November"," December"]; var myString = "[[date]]"; var mySplitResult = myString.split("-"); var mm = parseInt(mySplitResult[1],10)-1; // note that months are 0-11 document.write(mySplitResult[2] + " " + months[mm] + " " + mySplitResult[0] ); </script> I have, however, run across a little problem where I have results coming through with date AND time, e.g. 18:12 2010-07-14 What I need is something that will reorder the above to: 14 July 2010 at 18:12 Can someone help please! Regards, Neil Hello. I just want to check whether it is possible (and if so whether there is one available) to have a script that displays MY current time and date to visitors to my website. My time is Western European Time or Greenwich Mean Time. I would like visitors from eg Japan to see my local time and not their own. I think some date scripts I have seen use the user's local PC clock, but I am not sure? Thanks for any feedback and help! I have the following code on my site. I use this in the header of mysite Code: <script type="text/javascript"> var weekdaystxt=["Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat"] var montharray=("January","February","March","April","May","June","July","August","September","October","November","December") function showLocalgetthedate(){ var mydate=new Date() var year=mydate.getYear() if (year < 1000) year+=1900 var day=mydate.getDay() var month=mydate.getMonth() var daym=mydate.getDate() if (daym<10) daym="0"+daym function showLocalTime(container, servermode, offsetMinutes, displayversion){ if (!document.getElementById || !document.getElementById(container)) return this.container=document.getElementById(container) this.displayversion=displayversion var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>' this.localtime=this.serverdate=new Date(servertimestring) this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time this.updateTime() this.updateContainer() } showLocalTime.prototype.updateTime=function(){ var thisobj=this this.localtime.setSeconds(this.localtime.getSeconds()+1) setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second } showLocalTime.prototype.updateContainer=function(){ var thisobj=this if (this.displayversion=="long") this.container.innerHTML=this.localtime.toLocaleString() else{ var hour=this.localtime.getHours() var minutes=this.localtime.getMinutes() var seconds=this.localtime.getSeconds() var ampm=(hour>=12)? "PM" : "AM" var dayofweek=weekdaystxt[this.localtime.getDay()] this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+ " "+montharray(month)+" ("+dayofweek+")" } setTimeout(function(){thisobj.updateContainer()}, 1000) //update container every second } function formatField(num, isHour){ </script> I use this to display the information. Code: <script type="text/javascript"> new showLocalTime("timecontainer", "server-php", 0, "short") new showLocalTime("timecontainer2", "server-php", +300, "short") new showLocalTime("timecontainer3", "server-php", +360, "short") new showLocalTime("timecontainer4", "server-php", +600, "short") </script> This gives me 4 clocks which i set at different time zones Can someone assist me in showing me a way to accelerate the time for this clock. I would like the minutes to be only 5 seconds long versus the normal 60 seconds per minute. I fly a flight sim and the in game world clock is accelerated at this pace and my squad would like to be able to see the time it would currently be in the game so we can avoid launching the game at certain in game times. If this can't be done, does anyone know of a separate java script that can accomplish this? Thank you in advance, any and all help would be greatly appreciated. Hi everyone, hope you can help. I've got a JS events calendar on my website, and on one of the entries I want the ticket link not to appear until a certain time & date (9:30am, Fri 29 Apr 2011, UTC+1). I've written the code for this to work: Code: var releasetime = 1304065800000 var currentdate = new Date() var currenttime = currentdate.getTime() if (currenttime >= releasetime){ document.write("<a href=\"ticket link\" rel="nofollow" target=\"_blank\">BUY TICKETS</a>") } And that's all good and working fine. EXCEPT, because it's taking the time & date from the local machine, all the user has to do is change the date on his PC to be able to see the ticket link. Is there any way to get the *actual* date & time? Thanks Cliff I cannot get my JavaScript code to work. Does anyone know what I am doing wrong with the following code: <html> <head> <title>Welcome</title> </head> <body> <h1>Welcome to my Web Page</h1> <script type="text/javascript"> /* <![CDATA[ */ var dateObject = new Date(); var greeting = ""; var curTime = ""; var minuteValue = dateObject.getMinutes(); var hourValue = dateObject.getHours(); if (minuteValue < 10) minuteValue = "0" + minuteValue; if(hourValue < 12) { greeting = "<p>Good morning! " curTime = hourValue + ":" + minuteValue + " AM"; } else if (hourValue == 12) { greeting = "<p>Good afternoon! "; + minute Value + " PM"; } else if (hourValue == 17) { greeting = "<p>Good afternoon!" cutTime = (hourValue-12) + ":" + minuteValue + " PM" } else { greeting = "<p>Good evening! " curTime = (hourValue-12) + ":" + minuteValue + " PM" } var dayArray = newArray("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"); var monthArray = newArray("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"); var day = dateObject.getDay(); var month = dateObject.getMonth(); document.write("<p>"+ greeting + "It is " + curTime + " on " + dayArray[day] + ", " + monthArray[month] + " " + dateObject.getDate() + ", " + dateObject.getFullYear() + ".</p>"); /* ]]> */ </script> </body> </html> ~xhtml205 Quote: <SCRIPT LANGUAGE="JavaScript1.2"> <!-- Begin var days=new Array(8); days[1]="Monday"; days[2]="Tuesday"; days[3]="Wednesday"; days[4]="Thursday"; days[5]="Friday"; days[6]="Saturday"; days[7]="Sunday"; var months=new Array(13); months[1]="January"; months[2]="February"; months[3]="March"; months[4]="April"; months[5]="May"; months[6]="June"; months[7]="July"; months[8]="August"; months[9]="September"; months[10]="October"; months[11]="November"; months[12]="December"; var time=new Date(); var lmonth=months[time.getMonth() + 1]; var ldays=days[time.getDay() + 1]; var date=time.getDate(); var year=time.getYear(); var hour=time.getHours(); var min=time.getMinutes() if (year < 2000) year = year + 1900; if (hour > 15) { date = date + 1; } document.write("<center>" + lmonth +" "); document.write(date + ", " + year + "</center>"); // End --> </SCRIPT> </CENTER> Can anyone help me edit this so that on Saturday at 10am the date displays mondays date. Thanks Hello all. I have created a 2 frame site where I want the top frame (header) to redirect the other frame (main) to a different page depending on the date, time, and second. For example, on 12 FEB at 07:00:00, I would like the header frame to redirect the main frames page to EmmasBday.html; in which I would be alerted of my little sisters Birthday. This is for personal use and isn't going to be hosted online so I will just use JavaScript, it's basically a simple system to remind me of crucial events at certain times and dates so I don't forget them. The same events will apply every year, so there is no need to programme in specific years although having the option could prove useful. I am aware of other alternatives to achieve this, but would very much like to work with JavaScript; as I can expand it. As I state, this is for personal use and therefore won't be hosting it; I will use JavaScript throughout and cannot use anything else like PHP, Perl, etc. I am aware JavaScript takes the time & date from the computer hosting it (unlike PHP), which is fine. So, for example; at 14:30:00 I will be informed to get dinner; and at 15:00:45 I'll be informed to study. The knowledge you guys have presented so far is phenomenal, and I couldn't think of anybody better to ask for assistance. Anyway, I hope you can resolve my problem and I'm looking forward to a response! Thanks for your concern, you brain Gods you! AHa. Hello, I hope someone can help. I know on the front end using js you can get the date and time on client machine and store in a hidden field so it can be grabbed to use on the back-end to store in a database or even return a special message based on their time. However, I'm not too sure how to begin. Would anyone happen to have any idea on how to do this? Thanks in advanced! Hello, I would like to learn if there is way to change a different format every time the user want as example is Code: London 12:00:33 - Friday 18/03/2011 Thanks Hello, I've obtained the following code. Code: function makeDate(){ var d = new Date(); var strDate=d.getFullYear() + "/" + (d.getMonth()+1) + "/" + d.getDate() + " "; strDate += d.getHours() + ":" + d.getMinutes() +":"+ d.getSeconds() ; return strDate; and I think I'm going to get the time and date indications in 2 digits. I want to get it like this: 2009/12/07 18:07:33 NOT like: 2009/12/7 18:7:33 How should I alter the code? Can anyone help? Thanks in advance. Hi All, Im new to javascript (new to programming in general!) and I have a date script and a time script that I want to run and placed into a form. The form will be listed as: Date: 21/10/2014 Time: 03:20:00 PM I have the scripts and they are working.. only when I put them both in the same page, only one will work. Date Script: function my_curr_date() { var currentDate = new Date() var day = currentDate.getDate(); var month = currentDate.getMonth() + 1; var year = currentDate.getFullYear(); var my_date = day+"-"+month+"-"+year; document.getElementById("dateField").value=my_date; } <body onload='return my_curr_date();'> Time Script: function DisplayTime(){ if (!document.all && !document.getElementById) return timeElement=document.getElementById? document.getElementById("curTime"): document.all.tick2 var CurrentDate=new Date() var hours=CurrentDate.getHours() var minutes=CurrentDate.getMinutes() var seconds=CurrentDate.getSeconds() var DayNight="PM" if (hours<12) DayNight="AM"; if (hours>12) hours=hours-12; if (hours==0) hours=12; if (minutes<=9) minutes="0"+minutes; if (seconds<=9) seconds="0"+seconds; var currentTime=hours+":"+minutes+":"+seconds+" "+DayNight; timeElement.innerHTML="<font style='font-family:verdana, arial,tahoma;font- size:12px;color:#E25984; font-weight:bold;'>"+currentTime+"</b>" setTimeout("DisplayTime()",1000) } window.onload=DisplayTime ____________________________________ Separately, they both work perfectly. But together, only one will display. Any help is appreciated! Thanks, Jess Hi Guys, I am trying to implement a countdown on my website. I want to calculate the difference between the current date and Jan 1st 2012 at 12:01am. I need to have the format in dd:hh:mm:ss so i can push it into this class. I've been reading posts but can't get it to work properly. Can anyone help me convert the dates? Thanks in advance. Hi guys! Very new to registering here, but have lurked the forums for quite a while, and love the help I see the members give to those in need! Well, it's time to call myself: one of those in need! I'm building a "clan" website, and as such, there's things like clan events, competitions, and clan vs clan battles. However, the problem we have is that when listing the time, some people get confused with time zones, and as such, forget we Australians are a day ahead. As such, the easiest way to resolve this would be to have a date and time on the home page which we can then "refer" to when speaking about particular times an event is going to take place. What I pretty much want is something to say in text: "2:30am, Friday the 30th of October 2010" The GMT is going to be set to that of the server, so I'd like it to be GMT-7, so that when people visit the official game's server and see the time, they can then refer it back to our own time zone. I understand that a javascript script for date and time is available quite publically that can add or take 7 hours from your local time and call that the "GMT-7", but not everyone is on GMT+0, and as such, it gives multiple people different timings. I also want the time to update instantly (without refreshing the page). If I could PLEASE get some help, that would be greatly appreciated. I recently designed the website to be Halloween-related, and as such, want to launch it VERY soon (gosh, only 1 day to Halloween! HAPPY HALLOWEEN!), this is the only thing holding me back at the moment... Thank you for any help, I do very much appreciate it. (oh, p.s: I'm VERY new to javascript, and understand VERY little of it, if you give me a script and say "you can change the GMT to -7, please clearly indicate where I can do this as I won't be able to find it myself).. Thank you, thank you, thank you! |