# How do I convert a digit (430) into minutes/seconds (7:30)?

Show 200 post(s) from this thread on one page
Page 1 of 2 12 Last
• May 18, 2011, 14:43
StevenHu
How do I convert a digit (430) into minutes/seconds (7:30)?
I am creating a JS function that takes a time input in minutes only and divides that number by an inputted digit. I would like to know how we use Javascript to convert that result into minutes and seconds.

For instance, 30 (1800 seconds) divided by 4 = 450 seconds. How do I show that as 7:30? I can divide by 60 to get 7.5, but I don't know how to go from there. I got as far as the following, then got stuck.

PHP Code:

``` <form id="form2"><table> <tr> <td class="alignright"> <form id="pitStops"> Main length (minutes): <input class="display" type="number" size="4" value="" name="main"> </td> </tr> <tr> <td class="alignright"> Number of pit stops: <input class="display" type="number" size="4" value="" name="STOPSnum"> </td> </tr> <tr> <td class="alignright">  <input id="resultPitStops" class="buttPress2" type="button" value="Pit Time = ">  <input id="timeBetween" class="display2" size="4" type="number" value="" name="between"></td> </tr> </table></form> <SCRIPT LANGUAGE="JavaScript">   function heatpit(form) {     e = form.elements.main.value,     f = form.elements.STOPSnum.value,      secs2 = e * 60; periods = f + 1;     result2 = secs2 / periods;     form.elements.between.value = result2; } resultPitStops.onclick = function () {     var form = document.getElementById('form2');     heatpit(form); } </SCRIPT>  ```
Thanks!
• May 18, 2011, 15:32
paul_wilkins
You can use Math.floor to remove the decimal amount, leaving you with the number of minutes.
To get the number of seconds, you can use the modulus operator with what you divided by, to obtain the remainder.

Code javascript:

```var minutes = Math.floor(450 / 60); // 7 var seconds = 450 % 60; // 30```

450 seconds is 7 minutes and 30 seconds
• May 19, 2011, 08:41
StevenHu
Wow, thanks for the help! This is my current status. I implemented your code, but I'm not getting any results into the field. Where is my JS wrong?
HTML Code:

```<form id="form2"><table> <tr> <td class="alignright"> <form id="pitStops"> Main length (minutes): <input class="display" type="number" size="4" value="" name="main"> </td> </tr> <tr> <td class="alignright"> Number of pit stops: <input class="display" type="number" size="4" value="" name="STOPSnum"> </td> </tr> <tr> <td class="alignright"> <input id="resultPitStops" class="buttPress2" type="button" value="Pit Time = "> <input id="timeBetween" class="display2" size="4" type="number" value="" name="between"></td> </tr> </table></form> <SCRIPT LANGUAGE="JavaScript"> function heatpit(form) {     var e = form.elements.main.value, // put main field value into variable e     var f = form.elements.STOPSnum.value, // put STOPSnum field value into variable f     var secs2 = e * 60; // convert the minutes into seconds var periods = f + 1; // add 1 to the pit stop number get the number of divisions throughout the period     var result2 = secs2 / periods; // divide the full time by the number of periods     var seconds = result2 % 60; // use modulus operator to get the remainder and convert into seconds figure     var minutes = math.floor(secs2 / 60); // get the minute figure as a digit     var time = minutes + ":" + seconds; // concatenate everything into minutes and seconds     form.elements.between.value = time; // display in the "between" field } resultPitStops.onclick = function () {     var form = document.getElementById('form2');     heatpit(form); } </SCRIPT>```
• May 19, 2011, 12:24
paul_wilkins
Quote:

Originally Posted by StevenHu
Wow, thanks for the help! This is my current status. I implemented your code, but I'm not getting any results into the field. Where is my JS wrong?

It seems to be at this part.

Code:

`resultPitStops.onclick = function () {`
The resultPitStops value doesn't exist. You may want to instead use getElementsById to obtain a reference to that button, from which you can then assign an onclick event.
• May 19, 2011, 12:26
StevenHu
But isn't that button value right here?

<input id="resultPitStops" class="buttPress2" type="button" value="Pit Time = ">
• May 19, 2011, 12:32
paul_wilkins
Quote:

Originally Posted by StevenHu
But isn't that button value right here?

<input id="resultPitStops" class="buttPress2" type="button" value="Pit Time = ">

That's not a javascript value.
To access the button via its id attribute, you need to use getElementById

Alternatively you can give the input a name attribute, and access it via the form elements collection.
• May 19, 2011, 12:49
StevenHu
But the code has worked fine on the other pages if I do the following. The value shows up in the "runtime" field without using get element by id:

HTML Code:

```function formFuel(form) { var a = form.elements.tank.value, b = form.elements.driveMinutes.value, c = form.elements.driveSeconds.value, d = form.elements.consumed.value, var used = a - d; var secs = b * 60; var secstotal = secs + c; var secsPerCC = secstotal / used; var runtime2 = secsPerCC  * a; form.elements.ans.value = secsPerCC / 60; } runtime.onclick = function () {     var form = document.getElementById('form1');     formFuel(form); }```
There must be another reason why it's not working.
• May 19, 2011, 12:55
paul_wilkins
Other issues are with how the variables are declared.
Commonly variables should be declared as one declaration, separated by commas.

Code javascipt:

```var foo = 'foo', bar = 'bar', baz = 'baz';```
• May 19, 2011, 13:05
StevenHu
Thanks. I wrapped my lines with single quotes and got back the variable name instead of the variable itself. I'm supposed to wrap only actual digits in single quotes, right?

Also, how do you concatenate this properly:

time = minutes +":"+ seconds // should return "7:30"

where minutes and seconds have already been declared earlier?
• May 19, 2011, 13:09
paul_wilkins
Quote:

Originally Posted by StevenHu
Thanks. I wrapped my lines with single quotes and got back the variable name instead of the variable itself. I'm supposed to wrap only actual digits in single quotes, right?

That wasn't the problem I was conveying. The problem was that you used a comma at the end of the variable declarations, which confuses javascript into expecting another declaration that wasn't there.

Quote:

Originally Posted by StevenHu
Also, how do you concatenate this properly:

time = minutes +":"+ seconds // should return "7:30"

Apart from a missing semicolon at the end of the statement, that looks to be fine.
• May 19, 2011, 13:15
StevenHu
OK, I converted all semicolons to commas for all var declarations, with the last declaration ending in a semi-colon just before this line:

form.elements.ans.value = secsPerCC / 60;

var runtime = document.getElementById('runtime');

just above the line:
runtime.onclick = function () {
• May 19, 2011, 13:47
StevenHu
This is what I have now. With these revisions, no results make it into the two fields:
HTML Code:

```        <table border="0" cellpadding="5" cellspacing="0" width="100%"> <tr><td class="alignright"><form id="form1"> Tank capacity, cc's: <input class="display" type="number" size="4" value="" name="tank"> </td></tr> <tr><td class="alignright">Drive time, minutes: <input class="display" type="number" size="4" value="" name="driveMinutes"><br> <br>Drive time, seconds: <input class="display" type="number" size="4" value="0" name="driveSeconds"> </td></tr> <tr><td class="alignright"> Fuel remaining, cc's: <input class="display" type="number" size="4" value="" name="consumed"> </td></tr> <tr><td class="alignright"> <input id="runtime" name="runtime" class="buttPress2" type="button" value="Runtime ">  <input class="display2" size="4" type="number" value="" name="ans"> </td></tr> </form></table> <br> <table border="0" cellpadding="5" cellspacing="0" width="100%"> <tr><td class="alignright"><form id="form2"> Main length (minutes): <input class="display" type="number" size="4" value="" name="LENGTH"> </td></tr> <tr><td class="alignright"> Number of pit stops: <input class="display" type="number" size="4" value="" name="STOPS"> </td></tr> <tr><td class="alignright"> <input id="resultPitStops" name="resultPitStops" class="buttPress2" type="button" value="Pit Intervals "> <input id="Between" class="display2" size="4" type="number" value="" name="between"> </td></tr> </form></table> <SCRIPT LANGUAGE="JavaScript">   function formFuel(form) { var a = form.elements.tank.value, b = form.elements.driveMinutes.value, c = form.elements.driveSeconds.value, d = form.elements.consumed.value, used = (a - d), <!-- get the amount of fuel used  --> secs = (b * '60'), <!-- convert minutes into seconds  --> secstotal = (secs + c), <!-- add minutes and seconds to get total seconds  --> secsPerCC = (secstotal / used), <!-- divide the number of seconds into the used fuel amount for secs per cc  --> var seconds = (secsPerCC % '60'), <!-- use modulus operator to get the remainder and convert into seconds figure  --> var minutes = math.floor(secsPerCC / '60'),  <!-- get the minute figure as a digit  --> var runtime2 = minutes +":"+seconds, <!-- concatenate everything into minutes and seconds  --> runtime2 = (secsPerCC * a); <!-- get the amount of run time  --> form.elements.ans.value = runtime2; }   function heatpit(form) { var e = form.elements.LENGTH.value, <!-- put LENGTH field value into variable e  --> f = form.elements.STOPS.value, <!-- put STOPS field value into variable f  --> secs2 = (e * '60'), <!-- convert the minutes into seconds  --> periods = (f + '1'), <!-- add 1 to the pit stop number get the total  number of divisions throughout the period  --> result2 = (secs2 / periods), <!-- divide the full time by the number of periods  --> seconds = (result2 % '60'), <!-- use modulus operator to get the remainder and convert into seconds figure  --> minutes = math.floor(result2 / '60'), <!-- get the minute figure as a digit  --> time = minutes +":"+seconds; <!-- concatenate everything into minutes and seconds  --> form.elements.between.value = minutes; <!-- display in the "between" field s/b "time" value  --> } var runtime = document.getElementById('runtime'); runtime.onclick = function () {     var form = document.getElementById('form1');     formFuel(form); } var resultPitStops = document.getElementById('resultPitStops'); resultPitStops.onclick = function () {     var form = document.getElementById('form2');     heatpit(form); } </SCRIPT>```
• May 19, 2011, 13:48
paul_wilkins
You still have several var problems.
• May 19, 2011, 13:54
StevenHu
I went to w3schools.com for Javascript variables and each line of their list of variables end in a semi-colon, and there are no single-quotes around their digits. They are using double-quotes around strings.
• May 19, 2011, 13:56
paul_wilkins
Quote:

Originally Posted by StevenHu
I went to w3schools.com for Javascript variables

That helps to explain some things.

You may want to have a good read of the problems that w3schools has, over at w3schools - an intervention
• May 19, 2011, 13:59
StevenHu
I've never visited the site before now. I just chose it from a list of results in Google. Thanks for the heads-up!
• May 19, 2011, 14:32
StevenHu
Quote:

Originally Posted by paul_wilkins
You still have several var problems.

I need to remove "var" in front of several variables.
• May 19, 2011, 14:55
paul_wilkins
Quote:

Originally Posted by StevenHu
I need to remove "var" in front of several variables.

The most correct way is to use one var with comma-separated variable assignments.

Code javascript:

```var foo = 'foo', bar = 'bar', baz = 'baz';```

You can use separate var statements, but that then becomes tempting to use throughout different parts of your code, which is to be avoided.

Code javascript:

```var foo = 'foo'; var bar = 'bar'; var baz = 'baz';```

What is not allowed though, is to end one var statement with a comma, and to then start another var statement.

Code javascript:

```var foo = 'foo', // error, since another variable assignment is expected here var bar = 'bar'; var baz = 'baz';```

In terms of syntax, it doesn't matter whether single or double-quotes are used. However, since HTML commonly uses double-quotes for its attributes, it has become a standard practice to use single-quotes for javascript strings.

Whichever way you decide to use, just be consistent with it. If possible, pick a set of code conventions and stick with them. There are many different code conventions, but many of them tend to converge to the same fundamental ideas.
• May 19, 2011, 14:59
StevenHu
Thanks! Regarding Post #12, I removed the vars that followed commas. But it still doesn't work.
• May 19, 2011, 15:02
paul_wilkins
Quote:

Originally Posted by StevenHu
Thanks! Regarding Post #12, I removed the vars that followed commas. But it still doesn't work.

Submit your code in this javascript lint page, and it will show you the most obvious problem that need to be fixed in your code.

If you want your code to be fully without problems, there's a much harsher jslint process, but it's well worth it, especially with "the good parts" enabled.
• May 19, 2011, 15:06
StevenHu
It points to the beginning of this line, and says a semicolon is missing. Strange!

var resultPitStops = document.getElementById('resultPitStops');
• May 19, 2011, 15:08
paul_wilkins
Quote:

Originally Posted by StevenHu
It points to the beginning of this line, and says a semicolon is missing. Strange!

var resultPitStops = document.getElementById('resultPitStops');

That's where the problem starts. Look at the end of the previous line.
• May 19, 2011, 15:12
StevenHu
It also ends in a semi-colon. I don't see the problem:

var runtime = document.getElementById('runtime');
runtime.onclick = function () {
var form = document.getElementById('form1');
formFuel(form);
}
• May 19, 2011, 15:35
paul_wilkins
Are you sure it's only the javascript that you're submitting there?

I get a "SyntaxError: missing variable name" error at a very different place when submitting your scripting code.
• May 20, 2011, 06:19
StevenHu
Oh, I pasted in the whole page!
Show 200 post(s) from this thread on one page
Page 1 of 2 12 Last