Link to home
Start Free TrialLog in
Avatar of olegtim
olegtim

asked on

Auto Calculation script

Hi,

Here is what I have:
List of items on the page, each item has name, price next to it, drop down box to select quantity, and image on/off. What I need the script to do is when customers clicks on the image it turns on or off, and if its ON then the items price X quantity is added and displayed automtically on the bottom in input box, and if image clicked OFF than its deducted from the box. Also, somehow items IDs that are stored in hidden fields needs to be passed to the next page on submit, its a form. Any ideas?
Avatar of a.marsh
a.marsh

Can you give us a link to the code that you currently have? Or if there is not too much of it, paste it here in a comment? (A link would be better).

Then we can enhance it for you.

Ant
Avatar of olegtim

ASKER

Here is link but there i no code behind it, its jus tstatic HTML to see the example, actual info will be pulled from DB.

http://www.scipod.com/menu/menu.html
Do you HAVE to use ON/OFF images?

Can you not use checkboxes? I personally think it would be much better (and easier to implement).

Ant
Here you go:

<html>
<head>
<script language="javascript">
<!--

//Set this to the number of items in the list
numOfItems = 3;

function calcTotal(formObj){
  var returnTotal = 0;

  for(var i = 1; i <= numOfItems; i++){
    if(eval("formObj.item" + i + "Buy.checked")){
      returnTotal += parseInt(eval("formObj.item" + i + "Qty.value")) *
                     parseFloat(eval("formObj.item" + i + "Price.value"));
    }
  }

  //Make a string
  returnTotal = returnTotal + "";

  //Make sure returnTotal has 2 decimal places otherwise you'll get things like $4.5
  if(returnTotal.indexOf(".") == -1){
    returnTotal += ".00";
  }
  else{
    if((returnTotal.length - returnTotal.indexOf(".")) < 3){
      returnTotal += "0";
    }
  }

  formObj.total.value = returnTotal;
}

//-->
</script>
</head>
<body>
<form>
<table border="0" cellpadding="4" cellspacing="2">
<tr>
<td bgcolor="#cccccc">Buy?</td>
<td bgcolor="#cccccc">Qty</td>
<td bgcolor="#cccccc">Description</td>
<td bgcolor="#cccccc">Unit Price</td>
</tr>
<tr>
<td><input type="checkbox" name="item1Buy" onClick="calcTotal(this.form);"></td>
<td><select name="item1Qty" onChange="calcTotal(this.form);">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select></td>
<td>Cake</td>
<td>$6.40<input type="hidden" name="item1Price" value="6.40"></td>
</tr>

<tr>
<td><input type="checkbox" name="item2Buy" onClick="calcTotal(this.form);"></td>
<td><select name="item2Qty" onChange="calcTotal(this.form);">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select></td>
<td>Coffee Starbucks</td>
<td>$7.50<input type="hidden" name="item2Price" value="7.50"></td>
</tr>

<tr>
<td><input type="checkbox" name="item3Buy" onClick="calcTotal(this.form);"></td>
<td><select name="item3Qty" onChange="calcTotal(this.form);">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select></td>
<td>Dessert</td>
<td>$33.00<input type="hidden" name="item3Price" value="33.00"></td>
</tr>

<tr>
<td colspan="4" align="center">$<input type="text" name="total" value="0.00" size="6"></td>
</tr>
</table>
</form>
</body>
</html>


:o)

Ant
Avatar of olegtim

ASKER

Ok that looks awsome, now I increased the points so you will consider adjusting it to work with on/off images :), also when I press submit button how do I get the items tha were ordered? Lets say that each item identified with unique it and can be placed, well, where can it be place to be passed if selected to purchase :)
thank you
ASKER CERTIFIED SOLUTION
Avatar of a.marsh
a.marsh

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of olegtim

ASKER

Perfect work, just one little thing, in item 1 if I choose 6 or 7 items look at the number it gives :) can u fix that, thank you.
It also does a similiar thing when you choose 3.....Javascript is reknowned for problems like this.

I'll will try and work on it later tonight.

:o)

Ant