Percentage/price script

**wress44** · 06-21-2007, 07:38 AM

Hey everyone,

I'm teaching myself a couple of languages this summer and I'm currently learning Javascript. My friend is a CS major in college and he gave me a couple of his assignments to mess around with for fun. I'm working on this percentage/price script right now that I initially thought was really easy, but is currently giving me some trouble. I've successfully created a GUI, but my function isn't working.

The main goal of the project is that the function needs to return a final price based on two given percentages. There are two coffee types - Espresso ($5.99 per unit) and Sumatra ($8.99 per unit). I want to create a script that will allow me to mix the two types of coffee into one unit. The total percentage of this unit, of course, must equal 100%.

On the GUI, one textbox is for the percent Espresso and another is for the percent Sumatra. If the sum of these percents, equals one hundred, then the user can click the "Find Price" button and the final price will be displayed in a textbox below.

I just don't know how to correctly get the function to work. Once the percents are inputted, I want it to check if the sum of the percents equals 100. If it doesn't I want an alert box to pop up. If it does equal 100, I want it to do generate the final price by the formula ((Espresso * 5.99 + Sumatra * 8.99) / 100).

Here's the code I have so far:

Code:

<html>

<head>
<script type="text/javascript">
function CoffeeBlend() {
var EspressoPercent = parseFloat(document.form1.first.value)||0;
var SumatraPercent = parseFloat(document.form1.second.value)||0;
if (EspressoPercent + SumatraPercent == 100)
   {
   FinalPrice = (((EspressoPercent * 5.99) + (SumatraPercent * 8.99)) / 100);
   document.form1.answer.value == FinalPrice;
   }
else
   {
   alert("Your percentages must sum to 100. \n Click OK to contine.")
   }
</script>
</head>

<body>
<i><small>Please note that the sum of the percentages below must equal 100.</small></i>
<form name="form1">
<table align="left">
  <tr>
    <td>
      Percent Espresso in the blend: <input type="text" size="2" name="first">%
      //text and text box for the Espresso percentage
    <br>
      Percent Sumatra in the blend: <input type="text" size="2" name="second">%
      //text and text box for the Sumatra percentage
    <br>
      Final Price: $<input type="text" readonly="readonly" size="4" name="answer">
      //text box for the blend's final price
    <br>
      <input type="button" value="Find Price" onclick="CoffeeBlend()">   
      //button that generates the final price
      <input type="reset" class="gain" value="Clear Fields">
      //an extra button that clears the text boxes
    </td>
  </tr>
</table>
</form>
</body>

</html>

Am I going about the script correctly? All it needs is an if-else statement and the formula above. Should I have it in the head or the body?

Thanks for your help.

**codeexploiter** · 06-21-2007, 08:57 AM

Code:

<html>

<head>
<script type="text/javascript">
function CoffeeBlend() {
var EspressoPercent = parseFloat(document.form1.first.value)||0;
var SumatraPercent = parseFloat(document.form1.second.value)||0;
if (EspressoPercent + SumatraPercent == 100)
   {
   FinalPrice = (((EspressoPercent * 5.99) + (SumatraPercent * 8.99)) / 100);
   document.form1.answer.value == FinalPrice;
   }
else
   {
   alert("Your percentages must sum to 100. \n Click OK to contine.")
   }
</script>
</head>

<body>
<i><small>Please note that the sum of the percentages below must equal 100.</small></i>
<form name="form1">
<table align="left">
  <tr>
    <td>
      Percent Espresso in the blend: <input type="text" size="2" name="first">&#37;
      //text and text box for the Espresso percentage
    <br>
      Percent Sumatra in the blend: <input type="text" size="2" name="second">%
      //text and text box for the Sumatra percentage
    <br>
      Final Price: $<input type="text" readonly="readonly" size="4" name="answer">
      //text box for the blend's final price
    <br>
      <input type="button" value="Find Price" onclick="CoffeeBlend()">   
      //button that generates the final price
      <input type="reset" class="gain" value="Clear Fields">
      //an extra button that clears the text boxes
    </td>
  </tr>
</table>
</form>
</body>

</html>

There is one logical mistake in your above script which I've noted in red color and you must use single equal (=) while you assign a value as the following line

Code:

document.form1.answer.value = FinalPrice;

== used for comparison purposes not for assignment purposes.

Thread: Percentage/price script

Thread Tools

Search Thread

Percentage/price script

Bookmarks

Bookmarks

Posting Permissions