Member Avatar for stefig

Hello,
I am working on a script, but I'm really not an expert. Any help will be highly appreciated.
Description:
I have items - some have option for adding an amount and some not (because they can be only 1).
I need when the checkboxes are clicked (choosing an item) the total to be displayed in the text field at the bottom.
the single items work fine, but when i choose the one that can be added amount, it deletes the total from the first ones.
Below is the script so you can see what I'm trying to explain:

<html><head>
<script type="text/JavaScript"><!-- 

        var Cost;
        var Amount = 0;

function getNumber() {	
		Amount = document.orderform.EVT_01.value;
		}
function tally()        {
        Cost = 0;
        if (document.orderform.Item1.checked) { Cost = Cost + 40; }
        if (document.orderform.Item2.checked) { Cost = Cost + 30; }
        if (document.orderform.Item3.checked) { Cost = 100 * Amount; }
		
Cost = dollar(Cost);
document.orderform.Total.value = "$" + Cost;
        }

function dollar (amount)
{
        amount = parseInt(amount * 100);
        amount = parseFloat(amount/100);
        if (((amount) == Math.floor(amount)) && ((amount - Math.floor (amount)) == 0))
        {
                amount = amount + ".00"
                return amount;
        }
        if ( ((amount * 10) - Math.floor(amount * 10)) == 0)
        {
                amount = amount + "0";
                return amount;
        }
        if ( ((amount * 100) - Math.floor(amount * 100)) == 0)
        {
                amount = amount;
                return amount;
        }
        return amount;
}

//--></script>
</head>
<body><form name="orderform">
<table width="500" border="0" cellspacing="1" cellpadding="1">
<tr><td width="167"><input type="checkbox" name="Item1" value="Item1_chosen" onClick="tally()" />AAA</td>
<td width="51">$40</td>
<td width="109">&nbsp;</td></tr>
<tr><td><input type="checkbox" name="Item2" value="Item2_chosen" onClick="tally()" />BBB</td>
<td>$30</td>
<td>&nbsp;</td></tr>
<tr><td colspan="3">&nbsp;</td></tr>
<tr><td><input type="checkbox" name="Item3" value="Item3_chosen" onClick="tally()" /><span class="EventPrice"><a href="#" title=" 

CCC " target="_blank">CCC</a></span></td>
<td><span class="EventPrice">$100</span></td>
	
<td>Amount:<input name="EVT_01" type="text" id="EVT_01" value="0" size="3" maxlength="3" onChange="getNumber()" /></td></tr>
<tr>
<td colspan="3">&nbsp;</td></tr>
<tr><td>Total:<input name="Total" type="text" value="$0" size="7" readonly="readonly"></td>
<td colspan="2">&nbsp;</td></tr>
</table></form></body></html>

Thanks in advance for your help!

  • 2 Contributors
  • 3 Replies
  • 106 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by essential
Member Avatar for essential

Sorry if im bein hasty on this one!
Hope this wil solve the issue. Enjoy.

<html>
<head>
<title><!--Sample--></title>
<style type="text/css">
<!--
form label { color: #C0C0C0; font-weight: bold; }
form input { text-align: center; }
-->
</style>
<script type="text/javascript">
<!-- 

var invalidChar = /[A-Za-z]{1}|[\-\.\s]{1}/;
var maxLen = /[0-9]{4}/;

function validate( thisValue )
{ if ( invalidChar.test( thisValue ) ) 
{ alert('\nOnly numbers are allowed on this field!'); return false; }  
else if ( maxLen.test( thisValue ) ) { alert('\nMax length reachead!\nPlease try Again.'); document.form1.txt1.value = '0'; return false; } 
else { return true; }
}


document.onclick = function( chb )
{ chb = chb ? chb : window.event;
  thisCbox = chb.target ? chb.target : chb.srcElement;

var total = form1.txt2;
var amount = parseInt( form1.txt1.value )
var cost = 0;
var count = parseInt(thisCbox.value );
if (( thisCbox.name ) && ( thisCbox.name == 'cb0' ) && (thisCbox.checked )) { 
 cost = cost + count; }  

if (( thisCbox.name ) && ( thisCbox.name == 'cb1' ) && (thisCbox.checked )) { 
cost = cost + count;  }

if (( thisCbox.name ) && ( thisCbox.name == 'cb2' ) && (thisCbox.checked )) { 
cost = 100 * amount;  } 
cost = dollar(cost)

total.value = '$' + ( amount + cost ); 
}
function dollar( amount ) 
{ 
amount = parseInt(amount * 100 );
amount = parseFloat( amount/100 );  
if ((( amount ) == Math.floor( amount )) && (( amount - Math.floor ( amount )) == 0 ))  
{ 
amount = amount + ".00";    return amount;  }  
if ((( amount * 10
) -Math.floor(
amount * 10 )) == 0 ) {    amount = amount + "0";   return amount;  
}  if ((( amount * 100 ) -Math.floor( amount * 100 )) == 0)  { 
amount = amount;    
return amount;  } 
return amount; }
// -->
</script>
</head>
<body>
<div id="tester"></div>
<form name="form1">
<label>
<input type="checkbox" name="cb0" value="40" />&nbsp;&#36;40&nbsp;</label>
<label>
<input type="checkbox" name="cb1" value="30" />&nbsp;&#36;30&nbsp;</label>
<label><input type="checkbox" name="cb2" value="100" />&nbsp;&#36;100&nbsp;</label>

<br />
<label>Amount:</label><br />
<input type="text" name="txt1" size="3" value="0" onchange="validate(this.value);" /><br />
<label>Total:</label>&nbsp;
<input type="text" name="txt2" size="6" value="0"  onchange="validate(this.value);" readonly />
</form>
</body>
</html>
Member Avatar for stefig

on this script when you put amount - let's say 4, and start to check and uncheck the boxes the total goes crazy - it's $4400 instead 30+40+(4*100)=470

Member Avatar for essential

Oops my bad!
From your code-->
try to fix this line, like this and you are good to go! Enjoy

if (document.orderform.Item2.checked) { Cost = Cost + 30 + (Amount*1); } if (document.orderform.Item3.checked) 
{ Cost = Cost*1 +100 * Amount*1 + ( Amount*1 ) ; }
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.