Javascript Help

Boba Rhett · May 20, 2005

Hi guys, I come to you once again with a question!

The following is a small example of something I'm trying to set up for my brother. I only know enough about this to almost fill a table spoon so please help.

Here's the deal, it works perfectly in IE but in Firefox it will not update the total. I'm guessing this has something to do with the document.all but i could not get the GetElementByID workaround working. Can anyone help me?

<html><TABLE class=clsTable width="100%">
 <TBODY>
 <TR width="100%">
   <TD width=500>EDE12400 Stepper Motor Module:</TD>
   <TD class=clsFont align=right width=75>Quantity <BR><INPUT 
     onkeyup=CalcTotals(this) maxLength=8 size=10 value=0 name=EDE12400 
     P10000="47.85" P5000="48.00" P2500="49.50" P1000="50.00" P500="53.00" 
     P250="56.00" P100="58.5" P25="59.25" P10="60.00" P5="63.00" P1="65.00" 
     DestEle="total1"></TD>
   <TD class=clsFont align=left>Ext. Price<BR><INPUT readOnly size=10 
     name=total1 TotalMe="1"></TD></TR>
</TBODY></TABLE>



<SCRIPT language=JavaScript>
function CalcTotals(itm){

	var destEle = document.all(itm.DestEle)


	switch (true){
		case itm.value < 5:
			destEle.value = itm.value * itm.P1
			break;
		case itm.value < 10:
			destEle.value = itm.value * itm.P5
			break;
		case itm.value < 25:
			destEle.value = itm.value * itm.P10
			break;
		case itm.value < 100:
			destEle.value = itm.value * itm.P25
			break;
		case itm.value < 250:
			destEle.value = itm.value * itm.P100
			break;
		case itm.value < 500:
			destEle.value = itm.value * itm.P250
			break;
		case itm.value < 1000:
			destEle.value = itm.value * itm.P500
			break;
		case itm.value < 2500:
			destEle.value = itm.value * itm.P1000
			break;
		case itm.value < 5000:
			destEle.value = itm.value * itm.P2500
			break;
		case itm.value < 10000:
			destEle.value = itm.value * itm.P5000
			break;
		default:
			destEle.value = itm.value * itm.P10000
			break;
	}		
	destEle.value = FormatNum(destEle.value) //.replace("/\d.\d{2}/")
	GT()
}

function GT(){
	var NewVal = 0
	for (x=0;x<document.all.length;x++){
		if (document.all(x).TotalMe == "1"){
			if (! isNaN(parseFloat(document.all(x).value))){
				NewVal += parseFloat(RemoveFormating(document.all(x).value))
			}
		}
	}
	document.all.GRAND_TOT.value = FormatNum(NewVal)
}

function RemoveFormating(numVal){
	var MyVal = numVal.toString().replace(/\-|\$|\,/g,'');
	return MyVal
}

function FormatNum(numVal){

	numVal = RemoveFormating(numVal)
	if (isNaN(numVal))
		numVal = "0"
	numVal = Math.floor(numVal*100+0.50000000001)
	var cents = numVal%100
	numVal = Math.floor(numVal/100).toString()
	if (cents < 10)
		cents = "0" + cents
	for (var i = 0; i < Math.floor((numVal.length-(1+i))/3);i++)
		numVal = numVal.substring(0,numVal.length-(4*i+3))+','+ numVal.substring(numVal.length-(4*i+3))

	return numVal + "." + cents
}
</SCRIPT>
</B></CENTER></CENTER></BODY></HTML>

coupes. · May 20, 2005

Can you tell me exactly what it is supposed to do... I think I understand pretty well, only I'm not too sure :|

If I understand correctly, the value of the different items is supposed to change depending on the ammount you order ?

Hermie · May 20, 2005

That made as much sense to me as a hippo on a bicycle! \o/

Boba Rhett · May 20, 2005

Yeah, that's what it's supposed to do. We talked to the guy who put up the original system and he said that it just can't be made to work in Firefox with the current code. It doesn't seem to recognize any of the "*.*" stuff.

tk102 · May 20, 2005

Hi Boba,

Only IE supports the document.all property. Here's a portion of your code translated for cross-browser display. I had to explictly call a FORM and then assign your first object's parameters in a SCRIPT rather than just with the INPUT html.

(does not include the GT function...)

<html><body><TABLE class=clsTable width="100%">
 <TR width="100%">
   <TD width=500>EDE12400 Stepper Motor Module:</TD>
   <form name="myform">
   <TD class=clsFont align=right width=75>Quantity <BR><INPUT 
     onkeyup=CalcTotals() maxLength=8 size=10 value=0 name=EDE>
     <script language=Javascript> //<!--
      document.myform.EDE.P10000="47.85" 
      document.myform.EDE.P5000="48.00" 
      document.myform.EDE.P2500="49.50" 
      document.myform.EDE.P1000="50.00" 
      document.myform.EDE.P500="53.00"
      document.myform.EDE.P250="56.00" 
      document.myform.EDE.P100="58.5" 
      document.myform.EDE.P25="59.25" 
      document.myform.EDE.P10="60.00"
      document.myform.EDE.P5="63.00"
      document.myform.EDE.P1="65.00" 
// -->
    </script></TD>
   <TD class=clsFont align=left>Ext. Price<BR><INPUT readOnly size=10 
     name=total1 TotalMe="1"></TD></form></TR>
</BODY></TABLE>



<SCRIPT language=JavaScript>
function CalcTotals(){
               var itm=document.myform.EDE
	var destEle = document.myform.elements[1]
	switch (true){
		case itm.value < 5:
			destEle.value = itm.value * itm.P1
			break;
		case itm.value < 10:
			destEle.value = itm.value * itm.P5
			break;
		case itm.value < 25:
			destEle.value = itm.value * itm.P10
			break;
		case itm.value < 100:
			destEle.value = itm.value * itm.P25
			break;
		case itm.value < 250:
			destEle.value = itm.value * itm.P100
			break;
		case itm.value < 500:
			destEle.value = itm.value * itm.P250
			break;
		case itm.value < 1000:
			destEle.value = itm.value * itm.P500
			break;
		case itm.value < 2500:
			destEle.value = itm.value * itm.P1000
			break;
		case itm.value < 5000:
			destEle.value = itm.value * itm.P2500
			break;
		case itm.value < 10000:
			destEle.value = itm.value * itm.P5000
			break;
		default:
			destEle.value = itm.value * itm.P10000
			break;
	}		
	destEle.value = FormatNum(destEle.value) //.replace("/\d.\d{2}/")

}

One drawback here that you'll notice is that DestEle isn't passed as a parameter to CalcTotals. You could loop through the myform.elements[] array looking for DestEle but in this case I knew destEle ("total1") was the second element of the array.

Hope some of this helps.

coupes. · May 20, 2005

I changed your code a little, but I don't know if this is what you were trying to do...

f_priceLists() is called on the body's 'onLoad()' event. In this function you should create an array with the different prices for each item (P1, P5, P10, etc.).

f_numbers() makes sure only numbers can be used inside the ffields.

f_CalcTotals() calculates the total of the field that is being modified.

f_GrandTotal() adds all the subtotals and returns the grand total.

<html>
<head>
<title>Untitled Document</title>

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

////function f_PRICELISTS
function f_priceLists(){
a_item_01 = new Array(65, 63, 60, 59.25, 58.5, 56, 53, 50, 49.5, 48, 47.85);	
a_item_02 = new Array(35, 34, 32, 29.5, 28, 27, 25.5, 24.5, 24, 23.5, 23);
}

////function F_NUMBERS
function f_numbers(obj){
var oCurrent = eval("document.myForm."+obj+";");	
if (oCurrent.value == "" || isNaN(oCurrent.value))
	{oCurrent.value = "0"}
oCurrent.value = parseFloat(oCurrent.value);

f_CalcTotals(obj);	
return true;	
}

////function F_CALCTOATLS
function f_CalcTotals(obj){	

var oCurrent = eval("document.myForm."+obj+";");
var oCurrent_total = eval("document.myForm.t_"+obj+";");
var oCurrent_item = eval("a_"+obj+";");

	switch (true){
		case oCurrent.value < 5:
			oCurrent_total.value = eval("oCurrent_item[0]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 10:
			oCurrent_total.value = eval("oCurrent_item[1]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 25:
			oCurrent_total.value = eval("oCurrent_item[2]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 100:
			oCurrent_total.value = eval("oCurrent_item[3]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 250:
			oCurrent_total.value = eval("oCurrent_item[4]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 500:
			oCurrent_total.value = eval("oCurrent_item[5]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 1000:
			oCurrent_total.value = eval("oCurrent_item[6]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 2500:
			oCurrent_total.value = eval("oCurrent_item[7]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 5000:
			oCurrent_total.value = eval("oCurrent_item[8]*(oCurrent.value)").toFixed(2);
			break;
		case oCurrent.value < 10000:
			oCurrent_total.value = eval("oCurrent_item[9]*(oCurrent.value)").toFixed(2);
			break;
		default:
			oCurrent_total.value = eval("oCurrent_item[10]*(oCurrent.value)").toFixed(2);
			break;
	}		
	f_GrandTotal()
}

////function F_CALCTOATLS
function f_GrandTotal(){
document.myForm.total.value = (parseFloat(document.myForm.t_item_01.value) + parseFloat(document.myForm.t_item_02.value)).toFixed(2);
}

-->
</script>	

</head>

<body onLoad="f_priceLists()">

<form name="myForm">
<table width="500" border="0">
 <tr>
   <td width="100%"><b>Item</b></td>

   <td width="0" align="right"><b>Quantity</b></td>
   <td width="0" align="right"><b>Total</b></td>
 </tr>
 <tr>
   <td>Item 01</td>
   <td><input type="text" name="item_01" value="0" maxLength="8" size="10" align="right" onkeyup="f_numbers(this.name)" onchange="f_numbers(this.name)"></td>
   <td><input readonly name="t_item_01" value="0.00" size="10" align="right"></td>

 </tr>
 <tr>
   <td>Item 02</td>
   <td><input type="text" name="item_02" value="0" maxLength="8" size="10" align="right" onkeyup="f_numbers(this.name)" onchange="f_numbers(this.name)"></td>
   <td><input readonly name="t_item_02" value="0.00" size="10" align="right"></td>
 </tr>
 <tr>
   <td> </td>

   <td> </td>
   <td><input readonly name="total" value="0.00" size="10" align="right"></td>
 </tr>
</table>
</form>

</body>
</html>

Sign In

Javascript Help

Recommended Posts

Boba Rhett

Link to comment

Share on other sites

coupes.

Link to comment

Share on other sites

Hermie

Link to comment

Share on other sites

Boba Rhett

Link to comment

Share on other sites

tk102

Link to comment

Share on other sites

coupes.

Link to comment

Share on other sites

Archived

Browse

Activity