Tottal value from different forms

**shas1280** · 05-23-2010, 10:07 AM

How to get the tottal value from different form in a html page. i created 3 forms with checkboxes and each forms have tottal value and its working fine. now i want to get the grand tottal value frome this all the forms in a another div.. i dont no its possible or not? any one can help me..pleassss

here is the html what i have...

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> price list</title>

<script type="text/javascript">
<!--
/* This script and many more are available free online at
The JavaScript Source :: http://javascript.internet.com
Created by: Kevin Hartig :: http://www.grafikfx.net/ */

// Calculate the total for items in the form which are selected.
function calculateTotal(inputItem) {
  with (inputItem.form) {
    // Process each of the different input types in the form.
    if (inputItem.type == "radio") {   // Process radio buttons.
      // Subtract the previously selected radio button value from the total.
      calculatedTotal.value = eval(calculatedTotal.value) - eval(previouslySelectedRadioButton.value);
      // Save the current radio selection value.
      previouslySelectedRadioButton.value = eval(inputItem.value);
      // Add the current radio button selection value to the total.
      calculatedTotal.value = eval(calculatedTotal.value) + eval(inputItem.value);
    } else {   // Process check boxes.
      if (inputItem.checked == false) {   // Item was uncheck. Subtract item value from total.
          calculatedTotal.value = eval(calculatedTotal.value) - eval(inputItem.value);
      } else {   // Item was checked. Add the item value to the total.
          calculatedTotal.value = eval(calculatedTotal.value) + eval(inputItem.value);
      }
    }

    // Total value should never be less than 0.
    if (calculatedTotal.value < 0) {
      InitForm();
    }

    // Return total value.
    return(formatCurrency(calculatedTotal.value));
  }
}

// Format a value as currency.
function formatCurrency(num) {
  num = num.toString().replace(/\$|\,/g,'');
  if(isNaN(num))
     num = "0";
  sign = (num == (num = Math.abs(num)));
  num = Math.floor(num*100+0.50000000001);
  cents = num%100;
  num = Math.floor(num/100).toString();
  if(cents<10)
      cents = "0" + cents;
  for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
      num = num.substring(0,num.length-(4*i+3)) + ',' + num.substring(num.length-(4*i+3));
  return (((sign)?'':'-') + 'KD' + num + '.' + cents);
}

// This function initialzes all the form elements to default values.
function InitForm() {
  // Reset values on form.
  document.selectionForm.total.value='';
  document.selectionForm.calculatedTotal.value=0;
  document.selectionForm.previouslySelectedRadioButton.value=0;

  // Set all checkboxes and radio buttons on form to unchecked.
  for (i=0; i < document.selectionForm.elements.length; i++) {
    if (document.selectionForm.elements[i].type == 'checkbox' | document.selectionForm.elements[i].type == 'radio') {
      document.selectionForm.elements[i].checked = false;
    }
  }
}

//-->
</script>
<style type="text/css">
<!--
.wrapper {
	height: 550px;
	width: 350px;
	margin-top: 50px;
	margin-left: 50px;
}

.discription {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: lighter;
	color: #000000;
	float: left;
	height: 25px;
	width: 200px;
	overflow: hidden;
	position: relative;
	border: 1px solid #000000;
	text-transform: capitalize;
}
.checkbox {
	float: left;
	height: 26px;
	width: 24px;
	overflow: hidden;
	position: relative;
	text-align: center;
}
.item {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: lighter;
	color: #000000;
	float: left;
	width: 120px;
	height: 25px;
	border: 1px solid #000000;
	text-align: center;
}
.discription_hr {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: lighter;
	color: #FFFFFF;
	float: left;
	height: 25px;
	width: 200px;
	overflow: hidden;
	position: relative;
	background-color: #000000;
	border: 1px solid #000000;
}
.checkbox_hr {
	float: left;
	height: 26px;
	width: 24px;
	overflow: hidden;
	position: relative;
}
.item_hr {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: lighter;
	color: #FFFFFF;
	float: left;
	width: 120px;
	height: 25px;
	background-color: #000000;
	text-align: center;
	border: 1px solid #000000;
}

-->
</style>
</head>

<body>
<div class="wrapper">
  <form id="myform">
<div class="discription_hr">Form1</div>
  <div class="checkbox_hr"></div>
   <div class="item_hr">Item Price</div>
  <div class="discription">Item1</div>
  <div class="checkbox"><input name="Business cards, standard*" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox"></div>
   <div class="item">200</div>
  <div class="discription">Item2</div>
    <div class="checkbox"><input name="Business cards, international****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Business cards, international****"></div>
    <div class="item">200</div>
  <div class="discription">Item3</div>
    <div class="checkbox"> <input name="Business cards, monarch*****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Business cards, monarch*****"></div>
    <div class="item">200</div>
  <div class="discription">Item4</div>
    <div class="checkbox"><input name="Letterhead, standard****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Letterhead, standard****"></div>
    <div class="item">200</div>
  <div class="discription" style="background-color:#ff99cc">Tottal</div>
    <div class="checkbox"></div>
    <div class="item"style="background-color:#ff99cc"><input name="calculatedTotal" value="0" type="hidden">
        <input name="previouslySelectedRadioButton" value="0" type="hidden">
        <input name="total" readonly="readonly" 
onfocus="this.blur();" type="text" size="10" style="float:center; background-color:#ff99cc;"></div>

  </form>
  
   <form id="myform">
<div class="discription_hr">Form2</div>
  <div class="checkbox_hr"></div>
   <div class="item_hr">Item Price</div>
  <div class="discription">Item1</div>
  <div class="checkbox"><input name="Business cards, standard*" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox"></div>
   <div class="item">200</div>
  <div class="discription">Item2</div>
    <div class="checkbox"><input name="Business cards, international****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Business cards, international****"></div>
    <div class="item">200</div>
  <div class="discription">Item3</div>
    <div class="checkbox"> <input name="Business cards, monarch*****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Business cards, monarch*****"></div>
    <div class="item">200</div>
  <div class="discription">Item4</div>
    <div class="checkbox"><input name="Letterhead, standard****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Letterhead, standard****"></div>
    <div class="item">200</div>
  <div class="discription" style="background-color:#ff99cc">Tottal</div>
    <div class="checkbox"></div>
    <div class="item"style="background-color:#ff99cc"><input name="calculatedTotal" value="0" type="hidden">
        <input name="previouslySelectedRadioButton" value="0" type="hidden">
        <input name="total" readonly="readonly" 
onfocus="this.blur();" type="text" size="10" style="float:center; background-color:#ff99cc;"></div>

  </form>
  
   <form id="myform">
<div class="discription_hr">Form3</div>
  <div class="checkbox_hr"></div>
   <div class="item_hr">Item Price</div>
  <div class="discription">Item1</div>
  <div class="checkbox"><input name="Business cards, standard*" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox"></div>
   <div class="item">200</div>
  <div class="discription">Item2</div>
    <div class="checkbox"><input name="Business cards, international****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Business cards, international****"></div>
    <div class="item">200</div>
  <div class="discription">Item3</div>
    <div class="checkbox"> <input name="Business cards, monarch*****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Business cards, monarch*****"></div>
    <div class="item">200</div>
  <div class="discription">Item4</div>
    <div class="checkbox"><input name="Letterhead, standard****" value="200" 
onclick="this.form.total.value=calculateTotal(this);" type="checkbox" id="Letterhead, standard****"></div>
    <div class="item">200</div>
  <div class="discription" style="background-color:#ff99cc">Tottal</div>
    <div class="checkbox"></div>
    <div class="item"style="background-color:#ff99cc"><input name="calculatedTotal" value="0" type="hidden">
        <input name="previouslySelectedRadioButton" value="0" type="hidden">
        <input name="total" readonly="readonly" 
onfocus="this.blur();" type="text" size="10" style="float:center; background-color:#ff99cc;"></div>

  </form>
 
</div>
</body>
</html>

**kaos** · 05-26-2010, 12:05 AM

if its html & there all different pages, i dont think its possible. u may b able 2 do this w/ php.

Thread: Tottal value from different forms

Thread Tools

Search Thread

Tottal value from different forms

Bookmarks

Bookmarks

Posting Permissions