STUDENT - Javascript problem

**goldy300** · 10-02-2008 11:27 PM

Doing IT diploma but I'm stuck on an exercise for Java script.

Here it is:

The number of calories burned per hour by bicycling, jogging and swimming are 200, 475 and 275 respectively. A person loses 1Kg for each 1600 calories burned. Create a web application that allows the User to input the number of hours spent at each activity and then calculates the number of Kilograms burnt off.

**Salvatos** · 10-02-2008 11:41 PM

Edit: Skip to next post for your solution ;)

Are you completely stuck or is there just a part that is unclear to you? I know virtually nothing about JavaScript but I could give ideas and if you can combine it to PHP it's gonna be even easier.

Very simply put, I would make an html form with a dropdown list of the three activities OR three text inputs each representing one activity (so the user can check the three of them at once). Then your onSubmit property would call a calculation function that would use the form input's name to identify which formula it must use to get the total amount of calories (multiplying the number of hours per 200, 475 or 275)and complete it with translating the calories to kilograms.

You could then use a second form, with a text input, that would display the number of kilograms burnt. To do this, you just have to do like forums that display a number of characters allowed vs. characters already used. Which, if I remember correctly, works by giving an id to the text input and making its value change with a JS function (something like this.form.input.value = "your kg amount calculated above" but I'm very approximate on this).

I'm just saying this to give you ideas though, I won't be able to help you much when it comes to actual coding.
Hope that helps.

**dickey** · 10-03-2008 01:08 AM

This is something I come up with. If this helps I don't mind reps and credit donations.

HTML Code:

<html>
  <head>
    <script>
      function compute()
      {
        var input = document.getElementById('hours').value;
        var activity = document.getElementById('activity').value;
        calories = input * activity;
        out = document.getElementById('KG');
        out.value = calories/1600 + " KG";
        if (out.value>100) 
        {
          alert('Chances are you are dead by now. So wipe off that silly grin from your face!');
        }
        document.getElementById('message').style.display='block';        
      }
    </script>

  </head>
  <body>
    <form name='form1'>
      What form of activity did you do?
      <select name='activity'>
        <option value='200'>Cycling</option>
        <option value='475'>Jogging</option>
        <option value='275'>Swimming</option>
        <option value='2000000'>Harcore Sex</option>
      </select>
      <br />
      How many hours did you do it?
      <input type='text' name='hours' />
      <br />
      <input type='button' value='Compute' onclick='javascript:compute()' />
      <div id='message' style='display:none'>
        Congratulations you lost: 
        <input type='text' name='KG' />
        <br />
        <input type='reset' value='Again?' onclick="javascript:document.getElementById('message').style.display='none'" />
      </div>
    </form>
  </body>
</html>

if you are using firefox

HTML Code:

<html>
  <head>
    <script>
      function compute()
      {
        input = document.getElementById('hours');
        input = input.value;
        var activity = document.getElementById('activity').value;
        calories = input * activity;
        KG=calories/1600;
        out = document.getElementById('KG');
        out.value = calories/1600 + " KG";
        if (KG > 100) 
        {
          alert('Chances are you are dead by now. So wipe off that silly grin from your face!');
        }
        document.getElementById('message').style.display='block';        
      }
    </script>

  </head>
  <body>
    <form name='form1'>
      What form of activity did you do?
      <select name='activity' id='activity'>
        <option value='200'>Cycling</option>
        <option value='475'>Jogging</option>
        <option value='275'>Swimming</option>
        <option value='2000000'>Harcore Sex</option>
      </select>
      <br />
      How many hours did you do it?
      <input type='text' name='hours' id='hours' />
      <br />
      <input type='button' value='Compute' onclick='javascript:compute()' />
      <div id='message' style='display:none'>
        Congratulations you lost: 
        <input type='text' name='KG' id='KG' />
        <br />
        <input type='reset' value='Again?' onclick="javascript:document.getElementById('message').style.display='none'" />
      </div>
    </form>
  </body>
</html>

**Nahid_hossain** · 10-03-2008 01:32 AM

Try this simple code:

HTML Code:

<script type="text/javascript">
$byc=prompt("How many hours have you been bycycling?");
$jog=prompt("How many hours have you been jogging?");
$swm=prompt("How many hours have you been swimming?");
$loses=($byc*200+$jog*475+$swm*275)/1600;
$rloses=$loses.toFixed(2);
document.write("You have burnt "+$rloses+" Kilograms");
</script>

**mattura** · 10-03-2008 02:39 AM

All very well, but why should we do your homework for you?
If you had at least made a start, and gone wrong, then perhaps I'd be more helpful.

**dickey** · 10-03-2008 02:53 AM

Originally Posted by Nahid_hossain

Try this simple code:

HTML Code:

<script type="text/javascript">
$byc=prompt("How many hours have you been bycycling?");
$jog=prompt("How many hours have you been jogging?");
$swm=prompt("How many hours have you been swimming?");
$loses=($byc*200+$jog*475+$swm*275)/1600;
$rloses=$loses.toFixed(2);
document.write("You have burnt "+$rloses+" Kilograms");
</script>

It's good and simple. But I think if I was his instructor I would notice that it is not his work.

THis is a simple problem and he was stuck and it seems he didn't even have a code to start with.

**mattura** · 10-03-2008 03:22 AM

Also, I've never seen javascript that uses php variables!

Goldy would have to explain how the code works, so the above code is probably not much use after all (but very neat -all credit to Nahid)

**Salvatos** · 10-03-2008 04:11 AM

Originally Posted by mattura

All very well, but why should we do your homework for you?
If you had at least made a start, and gone wrong, then perhaps I'd be more helpful.

Well he didn't ask to make it for him, he just said he was stuck ;)

As I don't know much JS myself but am still fairly interested, is Nahid's code complete or would one have to add some html to provide the entries? I don't know how the prompt() function works, so... Just curiosity ^^

**goldy30** · 10-03-2008 08:01 AM

Originally Posted by mattura

All very well, but why should we do your homework for you?
If you had at least made a start, and gone wrong, then perhaps I'd be more helpful.

Not do homework for me... it was as one other guy said, I was unclear and needed to understand it. Most people have been heaps helpful... thanx everyone else.
Edit:
I can see the variations of doing this but I was thinking of the user adding values to all separate fields and then calculating total kilos lost after that. As I said I'm very vague on this so this may look stupid if it's wrong...

<HTML>
<HEAD>
<TITLE> New Document </TITLE>

</HEAD>

<script>
function compute()
{
document.form1.sum.value=(document.form1.cyc.value )* 200/1600;

document.form1.sum.value=(document.form1.jog.value )* 475/1600;

document.form1.sum.value=(document.form1.swim.valu e)* 275/1600;
}
</script>

</head>
<body>
<form name='form1'>
<b><font face="arial">How many kilo's have you lost?</font></b><p>
<font face="arial">
Cycling: <input name="cyc" type="text" size="4" onChange="compute()"><br>
Jogging: <input name="jog" type="text" size="4" onChange="compute()"><br>
Swimming:<input name="swim" type="text" size="4" onChange="compute()"><br>
You have lost: <input name="sum" type="text" size="7" value="0"> Kilograms.<br>
<input type="button" name="" value="Calculate">   <input type="reset" value="Reset">
</font>
</div>
</form>
</body>
</html>

Let me know... thanx!

**Salvatos** · 10-03-2008 08:14 AM

Watch the space on this line:
document.form1.sum.value=(document.form1.swim.valu e)* 275/1600;

Also "How many kilo's have you lost?" would be "How many kilos have you lost?" and you don't really need to close that first font tag since you're opening an identical one right after.

Now about the JS proper, there is the reset button which is not going to do anything.
Apart from that, I don't think your total is gonna come up right.
Again, I'm not an expert, but I'm pretty sure your sum is gonna end up to be equal to the amount related to swimming only, since you're overwriting the same variable on each line.
You should probably make three different variables and have a fourth combining all three, and this fourth one would be the one displayed.

Also, your submit (Calculate) button does not do anything since the sum updates as soon as the values are changed.

Thread: STUDENT - Javascript problem

LinkBack

Thread Tools

Display

STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Re: STUDENT - Javascript problem

Similar Threads

javascript and external javascript files problem

JavaScript problem

DB number problem

Problem with ad code (includes?)

Ad code problem!

Tags for this Thread

Posting Permissions