JavaScript - Time Difference Help
Hi, back for more help
Im doing a hire price script for my works website, i have two time input input boxes using <select> function. I need a script to figure out the time diffrence between the two times, and if the second time is 3 or more hours before the first time it adds a days charge, well, it dosent even need to figure out the exact difference between the two, only need to see if the second is > by 3 or more, here is my script 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" xml:lang="en" lang="en" profile="http://gmpg.org/xfn/11"> <head> <meta http-equiv="Content-Type" content="UTF-8" /> <title>Car Hire Ottershaw | Van Hire Ottershaw | Car Rental | Van Rental </title> <meta name="keywords" content="Car Hire Ottershaw, Surrey, Van Rental Ottershaw, Van Hire Ottershaw, Car Rental Ottershaw, " /> <link rel="stylesheet" href="layout-ff.css" type="text/css" media="screen, projection" /> <link rel="stylesheet" href="style.css" type="text/css" media="screen, projection" /> <!-- put java here................................. --> <script language="javascript" type="text/javascript" src="datetimepicker.js"> //Date Time Picker script- by TengYong Ng of http://www.rainforestnet.com //Script featured on JavaScript Kit (http://www.javascriptkit.com) //For this script, visit http://www.javascriptkit.com </script> <!-- stop java here ................................. --> </head> <body> <!-- content ................................. --> <form name="date"> <select name="car" id="car"> <option value="A">Manual Panda / Auto Smart</option> <option value="B">Manual Clio 3 3Dr or 5 Dr / Manual Picanto</option> <option value="CD">Manual Rio / Clio 1.2T / Auto Picanto</option> <option value="E">Manual Venga / Auto Rio</option> <option value="F">Auto Focus / Cee'd / Manual Megane</option> <option value="G">Auto Cee'd Estate / Manual Megane Estate</option> <option value="H">Auto Mondeo</option> <option value="I">Manual Sportage 2WD</option> <option value="J">Auto Sportage 4X4</option> <option value="K">Auto Galaxy / Manual RCZ</option> <option value="L">Auto Sorento 4X4</option> <option value="M">Manual Kangoo Van</option> <option value="O">Manual LWB LL29 Trafic</option> </select> <p>start date:</p> <input id='firstDate' type="text" size="25"><a href="javascript:NewCal('firstDate','ddmmyyyy')"><img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date"></a> <p>Start Time: <select name="time1" id="time1"> <option value="1">08:00</option> <option value="2">08:30</option> <option value="3">09:00</option> <option value="4">09:30</option> <option value="5">10:00</option> <option value="6">10:30</option> <option value="7">11:00</option> <option value="8">11:30</option> <option value="9">12:00</option> <option value="10">12:30</option> <option value="11">01:00</option> <option value="12">01:30</option> <option value="13">02:00</option> <option value="14">02:30</option> <option value="15">03:00</option> <option value="16">03:30</option> <option value="17">04:00</option> <option value="18">04:30</option> <option value="19">05:00</option> <option value="20">05:30</option> <option value="21">06:00</option> <option value="22">06:30</option> <option value="23">07:00</option> <option value="24">07:30</option> </select> <p>end date:</p> <input id='secondDate' type="text" size="25"><a href="javascript:NewCal('secondDate','ddmmyyyy')"><img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date"></a> <p>End Time: <select name="time2" id="time2"> <option value="1">08:00</option> <option value="2">08:30</option> <option value="3">09:00</option> <option value="4">09:30</option> <option value="5">10:00</option> <option value="6">10:30</option> <option value="7">11:00</option> <option value="8">11:30</option> <option value="9">12:00</option> <option value="10">12:30</option> <option value="11">01:00</option> <option value="12">01:30</option> <option value="13">02:00</option> <option value="14">02:30</option> <option value="15">03:00</option> <option value="16">03:30</option> <option value="17">04:00</option> <option value="18">04:30</option> <option value="19">05:00</option> <option value="20">05:30</option> <option value="21">06:00</option> <option value="22">06:30</option> <option value="23">07:00</option> <option value="24">07:30</option> </select> <p>Days:</p> <input type="text" name="days" /> <p>Price:</p> <input type="text" name="rentalamount" /> <p>Deposit:</p> <input type="text" id="depo" name="depo" /> <p>Excess mile price</p> <input type="text" name="mile" /> <p><input type="button" value="Quote" onclick="dateDiff() ;calculate() ;deposit() ;milecharge() ;agecheck()" /> <INPUT TYPE=RESET name="clear" value="Clear Form"/></p> </form> <p> GAV: Deposit and mile excess now working, 28 days now works and now have a reset button also made a pop up for age restriction(select sportage/galaxy/rcz ) all prices are now on here now all to do is set up cecks on the dates ( summer/ winter. collect before return e.c.t) im starting to like this java script **** !</p> <!-- /content --> </body> </html> thanks Similar Tutorialshi, 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 Please can u help? how would i get the total work hours between two times (8:30 to 5:30) from a web form. I tried just minusing one from the orther but it came back with "Nan" 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, anyone knows how to get the past 6th month date using time difference? like if the current date is given 18-April-2011 then the past 6th month date is 18-October-2010...how can this be done by using time difference? Thanks, verve Hi Code: var err_str=""; function validate_grid(value,id,ind) { $("#result").html(" ").show(); if(ind==1 || ind==2) { var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/; if(!patt.test(value)) { mygrid.setCellTextStyle(id,ind,"background-color:yellow;"); if(err_str!="") err_str+="\n"+(ind+1)+".Enter numbers and : only.."; else err_str=(ind+1)+".Enter numbers and : only"; return false; } else { mygrid.setCellTextStyle(id,ind,"background-color:white;"); return true; } } } alert(err-str); here ind==1 is from_time and ind==2 is to_time,i need to validate time as to_time must be always greater than from-time,if condition fails an alert msg should populate.time format is[05:00]as it is in string format im unable to do the validation for it.(ex:from-time=08:00 to-time=07:59 condition fails) thank you. Hello im using dhtmlx grid in this cells i have from time and to time (i.e ind==1 and ind==2) i need to validate time where to-time must be greater than from-time else it should alert an message,i have writeen a normal Regular expression for the time validation.as the time is i string format i.e[05:00],please can any one send me code for that. Code: var err_str=""; function validate_grid(value,id,ind) { if(ind==1 || ind==2) { var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/; if(!patt.test(value)) { mygrid.setCellTextStyle(id,ind,"background-color:yellow;"); if(err_str!="") err_str+="\n"+(ind+1)+".Enter numbers and : only.."; else err_str=(ind+1)+".Enter numbers and : only"; return false; } else { mygrid.setCellTextStyle(id,ind,"background-color:white;"); return true; } } } hi im using dhtml xgrid where i need to do validation for time ,(from-time and to-time i.e ind==1 and ind==2 ) to-time must be greater than from-time else i need to alert a message to-time must be greater than from-time. can any one send me the code for it time format is[05:00]. Code: var err_str=""; function validate_grid(value,id,ind) { $("#result").html(" ").show(); if(ind==1 || ind==2) { var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/; if(!patt.test(value)) { mygrid.setCellTextStyle(id,ind,"background-color:yellow;"); if(err_str!="") err_str+="\n"+(ind+1)+".Enter numbers and : only.."; else err_str=(ind+1)+".Enter numbers and : only"; return false; } else { mygrid.setCellTextStyle(id,ind,"background-color:white;"); return true; } } } 1 down vote favorite I do have the countdown script (see link below) to display the time between current time and the date given in real-time. However, I want to achieve to display the time difference between a given start and end time. Right now, it calculates from the current server time to the end time. I want to be able to set up my own start time and end time. Here is what I have: http://jsfiddle.net/BgEtE/ thank you for help I'm not really a Java writer, so I don't know how to do this myself, though I imagine it would be pretty simple. I am looking to add a script to a webpage that allows users to input a time manually, and have it converted to GMT/Zulu time and display the converted time. I have seen a lot of time zone conversion scripts online, but they all just convert whatever the current system time is to another time zone. I am looking for a script that allows users to convert a time and show the zulu time, for times other than the current time. The time zone the inputed local time would be in is +4:30 (Kabul). I don't really care about style or aestehtics, just a simple script I can insert into a web page to have a time input field. The converted output time can appear in another field, a popup bubble, etc, again style isn't really an issue. It's really just to help people in my job who need to know what the GMT/Zulu time was for certain local times after the fact. One would think it shouldn't be that hard to just subtract 4:30 in your head, but apparently it is. Sorry if just asking for code outright like this is frowned upon. I'm trying to write something to display the percentage difference of my parents' ages. I'm obviously having issue. Also I would like to shorted the percentage output to three digits, e.g. 9.25%. Any help would be greatly appreciated. Here is what I have. Code: //Set the two dates var dadDate=new Date(1964, 9, 27); //Month is 0-11 in JavaScript var momDate=new Date(1962, 4, 29); var today=new Date(); //Get 1 day in milliseconds var one_day=1000*60*60*24; //Calculate difference btw the two dates, and convert to days var dadDay=Math.ceil(today.getTime()-dadDate.getTime())/(one_day); var momDay=Math.ceil(today.getTime()-momDate.getTime())/(one_day); //Calculate difference var abDif=Math.abs(dadDay-momDay); var agePer=Math.ceil(((abDif)/(dadDay + momDay)/2)*100); document.write"Dad, congratulations. You are " agePer "% younger than Mom."; This is my first time doing JavaScript I don't what I did wrong here, but the problem its not showing up the current date and time. Code: <script language = "JavaScript" type="text/javascript"> now = new Date(); localtime = now.toString(); utctime = now.GMTString(); document.wite("<b>localtime</b>" + localtime + "</br>"); document.write("<b>utctime</b>" + utctime); </script> This is what supposed to look like I have tried using different browser chrome,IE9,Maxtor, and Opera my OS is Win7 Hi there How can you calculate the difference in two dates that are in different formats? I have one date as: '2010-06-16 21:20:44.000' and the other date as now = new Date(); I want to subtract the dates to see if it is over 30 days. Thanks! Hello, I'd like to be able to calculate the difference between 2 dates in the format dd/mm/yyyy var date1 = 06/01/2012 var date2 = 10/01/2012 Then an alert box would tell me there is a difference of 4 days. Thanks a bunch Jay. Hi all, I use JS to dynamically generate HTML such as a <select> dropdown menu. I do it by placing an empty element where I want the dropdown to appear (i.e. <span id="dropdown"></span>) then getElementById('dropdown') and insert the HTML with innerHTML = html. But I could also do it by getting the empty element and then doing an "insertBefore" or "appendChild" call. Is one "preferred" over the other? Is one "better" than the other? Thanks. -- Roger Hi peeps, I thought I'd post this here as I haven't had any luck finding what I'm after but wondered it someone else had seen a slideshow that worked this way. In theory it seems simple enough to do. Description: Bascially I'd have a slideshow with several list items (or divs) within it. Now the main think with this slidshow is the list items or divs would have differing widths. The pagination would be 'Previous' and 'next' arrows. When you clicked next, it would slide along and line up the left edge of the next item/div with the left item of the slideshow. An likewise for every click. Esentially I guess you'd be sliding along the width of the 'active slide'. 2 items/divs being visible in the window is not a problem, neither is one being cropped off at the end. As the 'active' slide would always be the left most slide. Does this seem Ok, am I making any sense at all? I hope so! If anyone has seen something like this it would be great or maybe point me in the right direction. Cheers & thanks for reading, Ste Calculating the difference between two dates in JavaScript is relatively straightforward, provided you choose the right Date methods to work with. Whichever way you get there.... see this http://www.tutorials99.com/tutorials...aScript/page_1 is there a simple way or any way at all of making the ($50.00) ($40.00) ($30.00) ($20.00) show the difference instead... like if i chose $40.00 then the $50.00 would say +$10.00 and the 30 and 20 would say -$10.00 and -$20.00 Code: <p align="left">CASE</p> <center> <select name="caseselect" style="width:625px" onchange="Calculate(); swapImage(this,'caseimg');"> <option value="50#COOLER MASTER Elite 310red.jpg" selected="1">COOLER MASTER Elite 310 Red ($50.00)</option> <option value="40#COOLER MASTER Elite 310blue.jpg">COOLER MASTER Elite 310 Blue ($40.00)</option> <option value="30#COOLER MASTER Elite 310orange.jpg">COOLER MASTER Elite 310 Orange ($30.00)</option> <option value="20#COOLER MASTER Elite 310silver.jpg">COOLER MASTER Elite 310 Silver ($20.00)</option> </select> Hi, I know this isn't in the context of the rest of the code but hoepfully it's enough to go on. Is anyone able to tell me why the following works in FireFox but not IE - Code: var DateTextBox; function WindowPostBack(newdate) { window.DatetextBox.SetDate(newDate); } and the following works in IE but not FireFox - Code: var DateTextBox; function WindowPostBack(newdate) { window[DatetextBox.id].SetDate(newDate); } FireFox doesn't recognise 'id', IE seems to require it. I need it to be supported in both so I've put in a check to see which browser the code is currently dealing with and used both snippets in an if/else but it seems to me that something so straightforward shouldn't require this and I am missing something obvious. Hopefully some wiser heads than mine can help me out with this. Many thanks in advance for any responses... |