Add Value Of Text Boxes Together

I have been searching and saw this question had a similiar request as to what I want... http://oldlook.experts-exchange.com/Web/Web_Languages/JavaScript/Q_20407297.html?query=add&searchType=topic

But mine is a little different....

I want to take the contents of a few boxes and add multiply divide etc... show the results of some in a 1/2 way box etc..

Basically its a order form that has tax boxes etc...

Structure:

   Subtotalbox - Number entered By User
  - Depositbox - Number entered By User
  +  Extra1box - Number Entered By User
  +  Extra2box - Number Entered By User
      TaxBox7% - Number Displayed By Total of boxes above by a %... 7% of total so far
      TaxBox8% - Number Displayed By Total of boxes above by a %... 8% of total so far
  + TotalBox - Total of all numbers above

It would be nice for the 2 extraboxes to be numbers entered automatically by what radio buttons above the form are selected. They are always going to be the same amount.

Hope it makes sense?

Bill D
LVL 14
B_DorseyAsked:
Who is Participating?
 
hartCommented:
how about this

<HTML>
<HEAD>
<TITLE>Untitled</TITLE>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function GetVal()
{
      var subtotal = document.frm.Subtotalbox.value;
      var deptotal = document.frm.Depositbox.value;
      var Extra1box = document.frm.Extra1box.value;
      var Extra2box = document.frm.Extra2box.value;
      if(!isNaN(subtotal) && !isNaN(deptotal) && !isNaN(Extra1box) && !isNaN(Extra2box))
      {
            var ntotal = (parseFloat(subtotal) - parseFloat(deptotal)) + parseFloat(Extra1box) + parseFloat(Extra2box);
            document.frm.TaxBox7.value = ntotal * 7/100;
            document.frm.TaxBox8.value = ntotal * 8/100;
            document.frm.TotalBox.value = ntotal + parseFloat(document.frm.TaxBox7.value) + parseFloat(document.frm.TaxBox8.value);
      }
      else
      {
            alert("Please enter numbers")
            return false;            
      }
      
}
//-->
</SCRIPT>
</HEAD>
<BODY>  
<form NAME="frm" METHOD="post" ONSUBMIT="return GetVal()">
<pre>
<input TYPE="Radio" NAME="r1" VALUE="10" ONCLICK="if(this.checked){document.frm.Extra1box.value='10';document.frm.Extra2box.value='10';GetVal();}"> 10&nbsp;&nbsp;<input TYPE="Radio" NAME="r1" VALUE="20" ONCLICK="if(this.checked){document.frm.Extra1box.value='20';document.frm.Extra2box.value='20';GetVal();}"> 20
<BR><BR>
Subtotalbox - <input TYPE="Text" NAME="Subtotalbox" MAXLENGTH="5" VALUE="" onKeyUp="GetVal()"><BR>
Depositbox      - <input TYPE="Text" NAME="Depositbox" MAXLENGTH="5" VALUE="" onKeyUp="GetVal()"><BR>
Extra1box      - <input TYPE="Text" NAME="Extra1box" MAXLENGTH="5" VALUE="" onKeyUp="GetVal()"><BR>
Extra2box      - <input TYPE="Text" NAME="Extra2box" MAXLENGTH="5" VALUE="" onKeyUp="GetVal()"><BR>
TaxBox7%       - <input TYPE="Text" NAME="TaxBox7" MAXLENGTH="5" VALUE="" DISABLED><BR>
TaxBox8%       - <input TYPE="Text" NAME="TaxBox8" MAXLENGTH="5" VALUE="" DISABLED><BR><BR>
TotalBox      - <input TYPE="Text" NAME="TotalBox" MAXLENGTH="5" VALUE="" DISABLED>
</PRE>
</FORM>
</BODY>
</HTML>

regards
Hart
0
 
B_DorseyAuthor Commented:
OK I think you have me on a good start, only prob is so far is that the tax numbers "document.frm.TaxBox8.value = ntotal * 8/100;" are really long, can they be rounded to the nearest cent?

For example I get something like 11.000120002123 as a response, can it be 11.00 instead?


VERY much appreciated
Bill D
0
 
alambresCommented:
hey, if ya need to round numbers, try this function:

**** params:
objnum : the number to round (*1) or the object containing the number to round(*2) (in ya case: document.frm.TaxBox8)
ndec : number of decimals to round to.
addz : boolean meaning if ya wanna add zeros to complete the number of decimals indicated.
  example:
       RoundNumber (2.78,2,false) >> it will return 2.8
       RoundNumber (2.78,2,true) >> it will return 2.80  (useful format when dealing with currency numbers)

*1: if ya send a number the function will return a number
*25: if ya send the object, the function update the value of the field rounding it.

function RoundNumber(objnum, ndec, addz)
{
      if (typeof(objnum) == "object")
      {
            num = objnum.value;
      }
      else
      {
            num = objnum;
      }
      
      if (num != "")
      {
            var factor = Math.pow(10, ndec);
      
            num = Math.round(num * factor);
            num = num / factor;
            if (addz)
            {
                  var dot = ("" + num).indexOf(".");
                  if (dot>=0)
                  {
                        var nzeros = dot + ndec + 1 - ("" + num).length;
                        for (i=0; i<nzeros;i++)
                        {
                              num = num + "0";
                        }      
                  }
                  else
                  {
                        num = num + ".";
                        for (i=0; i<ndec;i++)
                        {
                              num = num + "0";
                        }
                  }
            }
      }      
            
      if (typeof(objnum) == "object")
      {
            objnum.value = num;
      }
      else
      {
            return (num);
      }
}

hope it helps ya

peace

alambres
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
hartCommented:
try this out and let me know

<HTML>
<HEAD>
<TITLE>Untitled</TITLE>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function roundOff(value, dplaces)
{
      value=value.toString()

      if((value.indexOf(".")!=-1)&&(value.length>(value.indexOf(".")+dplaces)))
      {
          three = value.substring(value.indexOf(".")+dplaces+1,value.length)
          one = value.substring(0,value.indexOf(".")+dplaces)
          two = value.substring(value.indexOf(".")+dplaces,value.indexOf(".")+dplaces+1)
          if(parseInt(three)>=5)
            {
                  value=one+(parseInt(two)+1);value=parseFloat(value)
            }
          else
            {
                  value = one + two;
                  value = parseFloat(value)
            }
      }
    return value;
}

function GetVal()
{
      var subtotal = document.frm.Subtotalbox.value;
      var deptotal = document.frm.Depositbox.value;
      var Extra1box = document.frm.Extra1box.value;
      var Extra2box = document.frm.Extra2box.value;
      if(!isNaN(subtotal) && !isNaN(deptotal) && !isNaN(Extra1box) && !isNaN(Extra2box))
      {
            var ntotal = (parseFloat(subtotal) - parseFloat(deptotal)) + parseFloat(Extra1box) + parseFloat(Extra2box);
            document.frm.TaxBox7.value = roundOff(parseFloat(ntotal * 7/100), 2);            
            document.frm.TaxBox8.value = roundOff(parseFloat(ntotal * 8/100), 2);
            document.frm.TotalBox.value = roundOff((ntotal + parseFloat(document.frm.TaxBox7.value) + parseFloat(document.frm.TaxBox8.value)), 2);
      }
      else
      {
            alert("Please enter numbers")
            return false;            
      }
      
}
//-->
</SCRIPT>
</HEAD>
<BODY>  
<form NAME="frm" METHOD="post" ONSUBMIT="return GetVal()">
<pre>
<input TYPE="Radio" NAME="r1" VALUE="10" ONCLICK="if(this.checked){document.frm.Extra1box.value='10';document.frm.Extra2box.value='10';GetVal();}"> 10&nbsp;&nbsp;<input TYPE="Radio" NAME="r1" VALUE="20" ONCLICK="if(this.checked){document.frm.Extra1box.value='20';document.frm.Extra2box.value='20';GetVal();}"> 20
<BR><BR>
Subtotalbox - <input TYPE="Text" NAME="Subtotalbox" MAXLENGTH="10" VALUE="" onKeyUp="GetVal()"><BR>
Depositbox      - <input TYPE="Text" NAME="Depositbox" MAXLENGTH="10" VALUE="" onKeyUp="GetVal()"><BR>
Extra1box      - <input TYPE="Text" NAME="Extra1box" MAXLENGTH="10" VALUE="" onKeyUp="GetVal()"><BR>
Extra2box      - <input TYPE="Text" NAME="Extra2box" MAXLENGTH="10" VALUE="" onKeyUp="GetVal()"><BR>
TaxBox7%       - <input TYPE="Text" NAME="TaxBox7"  VALUE="" DISABLED><BR>
TaxBox8%       - <input TYPE="Text" NAME="TaxBox8"  VALUE="" DISABLED><BR><BR>
TotalBox      - <input TYPE="Text" NAME="TotalBox" VALUE="" DISABLED>
</PRE>
</FORM>
</BODY>
</HTML>

Regards
Hart
0
 
ahosangFinance Systems DeveloperCommented:
regarding the issue of fixed decimal places, why not use the toFixed function that is in the javascript 1.5 specs? For those userAgents that do not support the function yet, you could simply write it and add to the prototype of Number object.

result=calculation.toFixed(2);// where calculation is a number
0
 
alambresCommented:
oops, typo in the examples:

 example:
       RoundNumber (2.78,2,false) >> it will return 2.8
       RoundNumber (2.78,2,true) >> it will return 2.80  (useful format when dealing with currency numbers)
should be:
 example:
       RoundNumber (2.798,2,false) >> it will return 2.8
       RoundNumber (2.798,2,true) >> it will return 2.80  (useful format when dealing with currency numbers)

sorry.
0
 
B_DorseyAuthor Commented:
@Hart

One problem I see so far is that when its rounding its not rounding up at the ten cent mark..

For example if the price is 129.99 then the tax for tax 1 should be 9.10 but it comes up as 9.01


Bill D
0
 
hartCommented:
use this function and remove the roundoff function from ur page

function GetVal()
{
      var subtotal = document.frm.Subtotalbox.value;
      var deptotal = document.frm.Depositbox.value;
      var Extra1box = document.frm.Extra1box.value;
      var Extra2box = document.frm.Extra2box.value;
      if(!isNaN(subtotal) && !isNaN(deptotal) && !isNaN(Extra1box) && !isNaN(Extra2box))
      {
            var ntotal = (parseFloat(subtotal) - parseFloat(deptotal)) + parseFloat(Extra1box) + parseFloat(Extra2box);
            document.frm.TaxBox7.value = parseFloat(ntotal * 7/100).toFixed(2);            
            document.frm.TaxBox8.value = parseFloat(ntotal * 8/100).toFixed(2);
            document.frm.TotalBox.value = (ntotal + parseFloat(document.frm.TaxBox7.value) + parseFloat(document.frm.TaxBox8.value)).toFixed(2);
      }
      else
      {
            alert("Please enter numbers")
            return false;            
      }
      
}

.toFixed(2) will round to 2 decimals chack it and let me know....

---------------------------------------------------------------------------------------------------------------------------------------
one more code for rounding off [but u use toFixed() it will solve ur problem, this is just for ur reference

function round2d(amount)
{
      amount*=100;
      amount=Math.round(amount);
      amount/=100
      amount+=""
      
      n=""
      
      if(amount.indexOf('.')!=-1)
      {
            n=amount.substr(amount.indexOf('.')+1)
      }

      if(n.length<1)
      {
            amount+=".00"
      }
      else
      {
            if(n.length<2)
            {
            amount+="0"
            }
      }
return amount;
}


Regards
Hart



0
 
B_DorseyAuthor Commented:
Cool that works,


Quick question is there a way that I can put a checkbox beside the "TaxBox7" that if its not checked it wont add taxes (change it to 0.00)?

Same thing for TaxBox8


Thanks TONS

Bill D
0
 
hartCommented:
TaxBox7%      - <input TYPE="Text" NAME="TaxBox7"  VALUE="" DISABLED>&nbsp;&nbsp;<input TYPE="checkbox" NAME="checkTaxBox7"  VALUE="0" onclick="if(this.checked){document.frm.TaxBox7.value='0.00'};"><BR>
TaxBox8%      - <input TYPE="Text" NAME="TaxBox8"  VALUE="" DISABLED>&nbsp;&nbsp;<input TYPE="checkbox" NAME="checkTaxBox8"  VALUE="0" onclick="if(this.checked){document.frm.TaxBox8.value='0.00'};"><BR><BR>


Regards
Hart
0
 
B_DorseyAuthor Commented:
First off I appreciate all the help...

What you gave me above taces the numbers and changes them to 0.00 but it still adds it in the end.

Also if I uncheck it it still leaves it at 0.00


Thanks VERY Much


Bill D
0
 
hartCommented:
oh i just gave u the idea how to do it i didn't write the complete stuff

try the below code out hope its not too confusing

TaxBox7%      - <input TYPE="Text" NAME="TaxBox7"  VALUE="" DISABLED>&nbsp;&nbsp;<input TYPE="checkbox" NAME="checkTaxBox7"  VALUE="0" onclick="if(this.checked){document.frm.TaxBox7.value='0.00'}else{if(document.frm.r1[0].checked){document.frm.Extra1box.value='10';document.frm.Extra2box.value='10'}else{document.frm.Extra1box.value='20';document.frm.Extra2box.value='20'}};GetVal();"><BR>
TaxBox8%      - <input TYPE="Text" NAME="TaxBox8"  VALUE="" DISABLED>&nbsp;&nbsp;<input TYPE="checkbox" NAME="checkTaxBox8"  VALUE="0" onclick="if(this.checked){document.frm.TaxBox8.value='0.00'}else{if(document.frm.r1[0].checked){document.frm.Extra1box.value='10';document.frm.Extra2box.value='10'}else{document.frm.Extra1box.value='20';document.frm.Extra2box.value='20'}};GetVal();"><BR><BR>

0
 
B_DorseyAuthor Commented:
Hmmmm Im stumped, it doesnt do anything...

Basically I need to take 'Taxbox7' have a checkbox so that if its unchecked that it will take the amount thats in it and minus it from the Total and display 0.00 in the box instead.

For somereason, I played with what you gave me, and changed this 'r1[0]' to 'TaxBox7' and it puts 10's and 20's in the Extra's boxes, and nothing to the tax boxes.

Bill D
0
 
B_DorseyAuthor Commented:
I have to tell ya, Ive never used Java really before, just so you know where my knowledge of it is :)

Bill D
0
 
hartCommented:
sorry forget my earlier post i will give u a new code :-)

Regards
Hart
0
 
B_DorseyAuthor Commented:
Here is what I have so far,

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.text-black12 {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-variant: normal;
      text-transform: none;
      color: #000000;
      text-decoration: none;
}
.text-white12 {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-variant: normal;
      text-transform: none;
      color: #FFFFFF;
      text-decoration: none;
}
.forms-180 {
      height: 20px;
      width: 180px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 0px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: none;
      border-left-style: none;
      text-align: center;
}
.forms-360 {
      height: 20px;
      width: 360px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 1px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: solid;
      border-left-style: none;
      border-bottom-color: #000000;
      text-align: left;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
}
.forms-120 {
      height: 20px;
      width: 120px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 1px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: solid;
      border-left-style: none;
      border-bottom-color: #000000;
      text-align: left;
      text-align: left;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
}
.forms-200 {
      height: 20px;
      width: 200px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 1px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: solid;
      border-left-style: none;
      border-bottom-color: #000000;
      text-align: left;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
}
.forms-140 {
      height: 20px;
      width: 120px;
      border-top-width: 1px;
      border-right-width: 1px;
      border-bottom-width: 1px;
      border-left-width: 1px;
      border-top-style: solid;
      border-right-style: solid;
      border-bottom-style: solid;
      border-left-style: solid;
      border-bottom-color: #666666;
      text-align: right;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
      border-top-color: #666666;
      border-right-color: #666666;
      border-left-color: #666666;
}
-->
</style>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function GetVal()
{
    var ssubtotal = document.frm.ssubtotal.value;
    var sdeposit = document.frm.sdeposit.value;
    var swrapprice = document.frm.swrapprice.value;
    var scustomprice = document.frm.scustomprice.value;
      var scoatprice = document.frm.scoatprice.value;
    if(!isNaN(ssubtotal) && !isNaN(sdeposit) && !isNaN(swrapprice) && !isNaN(scustomprice) && !isNaN(scoatprice))
    {
             var ntotal = (parseFloat(ssubtotal) + parseFloat(swrapprice) + parseFloat(scustomprice) + parseFloat(scoatprice));
         document.frm.spst.value = parseFloat(ntotal * 7/100).toFixed(2);
         document.frm.sgst.value = parseFloat(ntotal * 8/100).toFixed(2);
         document.frm.stotal.value = ((ntotal + parseFloat(document.frm.spst.value) + parseFloat(document.frm.sgst.value)) - parseFloat(sdeposit)).toFixed(2);
             
    }
    else
    {
         alert("Please enter numbers")
         return false;          
    }
   
}
//-->
</SCRIPT>
</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="GetVal()">
<table width="670" border="0" align="center" cellpadding="0" cellspacing="0">
<form NAME="frm">
  <tr>
    <td><table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="190"><img src="images/header_left.gif" width="190" height="60"/></td>
          <td align="center"><img src="images/header_center.gif" width="190" height="60"/></td>
          <td width="200" align="right"><img src="images/header_right.gif" width="200" height="60"/></td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="2"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="5"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="1"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td class="text-black12"><strong>ESTIMATE SHEET</strong></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td align="left" valign="top">
              <table width="470" border="0" cellpadding="0" cellspacing="0" background="images/spacer_blue.gif">
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>CUSTOMER</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td bgcolor="#FFFFFF">
                        <table width="460" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td width="95"><img src="images/spacer.gif" width="95" height="3"/></td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="3"/></td>
                      <td><img src="images/spacer.gif" width="360" height="3"/></td>
                    </tr>
                    <tr>
                        <td width="95" align="right" class="text-black12">Brides
                          Name:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td><input name="sgroupname" type="text" class="forms-360"/></td>
                    </tr>
                    <tr>
                      <td width="95" align="right" class="text-black12">Address:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td><input name="saddress" type="text" class="forms-360"/></td>
                    </tr>
                    <tr>
                      <td width="95" align="right" valign="middle" class="text-black12">City:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td>
                                <table width="360" border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td width="120"><input name="scity" type="text" class="forms-120"/></td>
                            <td width="115" align="right" valign="middle" class="text-black12">Province:</td>
                            <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                            <td width="120"><input name="sprovince" type="text" class="forms-120"/></td>
                          </tr>
                      </table>
                                </td>
                    </tr>
                    <tr>
                      <td width="95" align="right" valign="middle" class="text-black12">Postal Code:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td>
                                <table width="360" border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td width="120"><input name="spostalcode" type="text" class="forms-120"/></td>
                            <td width="115" align="right" class="text-black12">Number In Party:</td>
                            <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                            <td width="120"><input name="snumberinparty" type="text" class="forms-120"/></td>
                          </tr>
                      </table>
                                </td>
                    </tr>
                              <tr>
                      <td width="95" align="right" valign="middle" class="text-black12">Home Phone:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td>
                                <table width="360" border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td width="120"><input name="shomephone" type="text" class="forms-120"/></td>
                            <td width="115" align="right" class="text-black12">Business Phone:</td>
                            <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                            <td width="120"><input name="sbusinessphone" type="text" class="forms-120"/></td>
                          </tr>
                      </table>
                                </td>
                    </tr>
                              <tr>
                      <td width="95" align="right" class="text-black12">Brides Email:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td><input name="sbridesemail" type="text" class="forms-360"/></td>
                    </tr>
                    <tr>
                      <td width="95"><img src="images/spacer.gif" width="95" height="4"/></td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="4"/></td>
                      <td><img src="images/spacer.gif" width="360" height="4"/></td>
                    </tr>
                </table>
                        </td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td><img src="images/spacer.gif" width="1" height="1"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
          </table>
              </td>
          <td width="10"><img src="images/spacer.gif" width="10" height="10"></td>
          <td width="190" align="left" valign="top">
              <table width="190" border="0" cellpadding="0" cellspacing="0" background="images/spacer_blue.gif">
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>WEDDING DAY</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="32" align="center" bgcolor="#FFFFFF"><input name="sweddingdate" type="text" class="forms-180"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
                    <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>CURRENT DAY</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="32" align="center" bgcolor="#FFFFFF"><input name="scurrentdate" type="text" class="forms-180"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
                    <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>DRESS STATUS</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="32" align="center" bgcolor="#FFFFFF"><select name="sstatus" class="forms-180"></select></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td><img src="images/spacer.gif" width="1" height="1"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
          </table>
              </td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="145" align="right" class="text-black12">Bridesmaids Name:</td>
          <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
          <td>
              <table width="520" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200"><input name="sbridesmaidsname" type="text" class="forms-200"/></td>
                <td align="right" class="text-black12">Email Address:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="200"><input name="sbridesmaidsemailaddress" type="text" class="forms-200"/></td>
              </tr>
          </table>
              </td>
        </tr>
        <tr>
          <td width="145" align="right" class="text-black12">Style Number:</td>
          <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
          <td>
              <table width="520" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200"><input name="sstylenumber" type="text" class="forms-200"/></td>
                <td align="right" class="text-black12">Fabric Quality #:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="200"><input name="sfabricqualitynumber" type="text" class="forms-200"/></td>
              </tr>
          </table>
              </td>
        </tr>
        <tr>
          <td width="145" align="right" class="text-black12">Fabric Supplier:</td>
          <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
          <td>
              <table width="520" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200"><input name="sfabricsupplier" type="text" class="forms-200"/></td>
                <td align="right" class="text-black12">Color Code:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="200"><input name="scolorcode" type="text" class="forms-200"/></td>
              </tr>
          </table>
              </td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td><input type="radio" name="scustomcheck" value="" onclick="if(this.checked){document.frm.scustomprice.value='0.00';GetVal();}" checked="true"><input type="radio" name="scustomcheck" VALUE="25.00" ONCLICK="if(this.checked){document.frm.scustomprice.value='25.00';GetVal();}"></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="390" align="left" valign="top">
              <table width="390" border="0" cellpadding="0" cellspacing="0" background="images/spacer_blue.gif">
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>PLEASE NOTE:</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td bgcolor="#FFFFFF">
                        <table width="380" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td><img src="images/spacer.gif" width="380" height="5"/></td>
                    </tr>
                    <tr>
                      <td class="text-black12"><strong>BALANCE DUE AT TIME OF PICKUP</strong><br/><img src="images/spacer.gif" width="380" height="5"/><br/>We <strong>DO NOT</strong> take cheques or credit cards for final payments.<br/><img src="images/spacer.gif" width="380" height="10"/><br/><strong><font color="#FF0000"><u>Sorry We Do Not Do Alterations</u></font></strong></td>
                    </tr>
                    <tr>
                      <td><img src="images/spacer.gif" width="380" height="5"/></td>
                    </tr>
                </table>
                        </td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td><img src="images/spacer.gif" width="1" height="1"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
          </table>
              </td>
          <td width="10"><img src="images/spacer.gif" width="10" height="10"/></td>
          <td width="270" align="left" valign="top">
              <table width="270" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td align="right" class="text-black12">Sub Total:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="ssubtotal" type="text" value="129.99" class="forms-140" onKeyUp="GetVal()"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Wrap Price:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="swrapprice" type="text" value="0.00" onKeyUp="GetVal()" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Custom Price:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="scustomprice" type="text" value="0.00" onKeyUp="GetVal()" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Coat Price:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="scoatprice" type="text" value="0.00" onKeyUp="GetVal()" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">PST:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="spst" type="text" value="0.00" class="forms-140" disabled="true"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">GST:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="sgst" type="text" value="0.00" class="forms-140" disabled="true"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Less Deposit:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="sdeposit" type="text" class="forms-140" onKeyUp="GetVal()" value=" "/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Total:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="stotal" type="text" value="0.00" class="forms-140" onKeyUp="GetVal()"/></td>
              </tr>
          </table>
              </td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="385" height="50"><img src="images/spacer.gif" width="385" height="50"/></td>
          <td width="20" height="50"><img src="images/spacer.gif" width="20" height="50"/></td>
          <td width="265" height="50"><img src="images/spacer.gif" width="265" height="50"/></td>
        </tr>
        <tr>
          <td width="385" bgcolor="#000000"><img src="images/spacer.gif" width="385" height="1"/></td>
          <td width="20" bgcolor="#FFFFFF"><img src="images/spacer.gif" width="20" height="1"/></td>
          <td width="265" bgcolor="#000000"><img src="images/spacer.gif" width="265" height="1"/></td>
        </tr>
        <tr>
          <td width="385" height="20" class="text-black12"><img src="images/spacer.gif" width="10" height="20" align="absmiddle"/>Signature</td>
          <td width="20"><img src="images/spacer.gif" width="20" height="20" align="absmiddle"/></td>
          <td width="265" height="20" class="text-black12"><img src="images/spacer.gif" width="10" height="20" align="absmiddle"/>Date</td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="2"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="5"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="1"/></td>
  </tr>
</form>
</table>
</body>
</html>

Bill D
0
 
hartCommented:
use this code


<HEAD>
<TITLE>Untitled</TITLE>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--

function GetVal()
{
      
      var subtotal = document.frm.Subtotalbox.value;
      var deptotal = document.frm.Depositbox.value;
      var Extra1box = document.frm.Extra1box.value;
      var Extra2box = document.frm.Extra2box.value;
      if(!isNaN(subtotal) && !isNaN(deptotal) && !isNaN(Extra1box) && !isNaN(Extra2box))
      {
            var ntotal = (parseFloat(subtotal) - parseFloat(deptotal)) + parseFloat(Extra1box) + parseFloat(Extra2box);
            if(document.frm.checkTaxBox7.checked)            
            {
                  document.frm.TaxBox7.value = '0.00';      
            }
            else
            {      
                  document.frm.TaxBox7.value = parseFloat(ntotal * 7/100).toFixed(2);            
            }
            if(document.frm.checkTaxBox8.checked)            
            {
                  document.frm.TaxBox8.value = '0.00';      
            }
            else
            {      
                  document.frm.TaxBox8.value = parseFloat(ntotal * 8/100).toFixed(2);            
            }            
            document.frm.TotalBox.value = (ntotal + parseFloat(document.frm.TaxBox7.value) + parseFloat(document.frm.TaxBox8.value)).toFixed(2);
      }
      else
      {
            alert("Please enter numbers")
            return false;            
      }
      
}
//-->
</SCRIPT>
</HEAD>
<BODY>  
<form NAME="frm" METHOD="post" ONSUBMIT="return GetVal()">
<pre>
<input TYPE="Radio" NAME="r1" VALUE="10" ONCLICK="if(this.checked){document.frm.Extra1box.value='10';document.frm.Extra2box.value='10';GetVal();}" CHECKED> 10&nbsp;&nbsp;<input TYPE="Radio" NAME="r1" VALUE="20" ONCLICK="if(this.checked){document.frm.Extra1box.value='20';document.frm.Extra2box.value='20';GetVal();}"> 20
<BR><BR>
Subtotalbox - <input TYPE="Text" NAME="Subtotalbox" MAXLENGTH="10" VALUE="" onKeyUp="GetVal()"><BR>
Depositbox      - <input TYPE="Text" NAME="Depositbox" MAXLENGTH="10" VALUE="" onKeyUp="GetVal()"><BR>
Extra1box      - <input TYPE="Text" NAME="Extra1box" MAXLENGTH="10" VALUE="10" onKeyUp="GetVal()"><BR>
Extra2box      - <input TYPE="Text" NAME="Extra2box" MAXLENGTH="10" VALUE="10" onKeyUp="GetVal()"><BR>
TaxBox7%      - <input TYPE="Text" NAME="TaxBox7"  VALUE="" DISABLED>&nbsp;&nbsp;<input TYPE="checkbox" NAME="checkTaxBox7"  VALUE="0" onclick="GetVal();"><BR>
TaxBox8%      - <input TYPE="Text" NAME="TaxBox8"  VALUE="" DISABLED>&nbsp;&nbsp;<input TYPE="checkbox" NAME="checkTaxBox8"  VALUE="0" onclick="GetVal();"><BR><BR>
TotalBox      - <input TYPE="Text" NAME="TotalBox" VALUE="" DISABLED>
</PRE>
</FORM>
</BODY>
</HTML>

Regards
Hart
0
 
B_DorseyAuthor Commented:
Above and BEYOND , thanks

1 small favour...

Below is the code I have manipulated to work around my page, only prob is that off the start the 'Total' shows a 'NaN'...

Is there a way that I can display the proper total off the start?

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.text-black12 {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-variant: normal;
      text-transform: none;
      color: #000000;
      text-decoration: none;
}
.text-white12 {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-variant: normal;
      text-transform: none;
      color: #FFFFFF;
      text-decoration: none;
}
.forms-180 {
      height: 20px;
      width: 180px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 0px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: none;
      border-left-style: none;
      text-align: center;
}
.forms-360 {
      height: 20px;
      width: 360px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 1px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: solid;
      border-left-style: none;
      border-bottom-color: #000000;
      text-align: left;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
}
.forms-120 {
      height: 20px;
      width: 120px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 1px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: solid;
      border-left-style: none;
      border-bottom-color: #000000;
      text-align: left;
      text-align: left;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
}
.forms-200 {
      height: 20px;
      width: 200px;
      border-top-width: 0px;
      border-right-width: 0px;
      border-bottom-width: 1px;
      border-left-width: 0px;
      border-top-style: none;
      border-right-style: none;
      border-bottom-style: solid;
      border-left-style: none;
      border-bottom-color: #000000;
      text-align: left;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
}
.forms-140 {
      height: 20px;
      width: 120px;
      border-top-width: 1px;
      border-right-width: 1px;
      border-bottom-width: 1px;
      border-left-width: 1px;
      border-top-style: solid;
      border-right-style: solid;
      border-bottom-style: solid;
      border-left-style: solid;
      border-bottom-color: #666666;
      text-align: right;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #006699;
      text-decoration: none;
      vertical-align: bottom;
      border-top-color: #666666;
      border-right-color: #666666;
      border-left-color: #666666;
}
-->
</style>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function GetVal()
{
    var ssubtotal = document.frm.ssubtotal.value;
    var sdeposit = document.frm.sdeposit.value;
    var swrapprice = document.frm.swrapprice.value;
    var scustomprice = document.frm.scustomprice.value;
      var scoatprice = document.frm.scoatprice.value;
    if(!isNaN(ssubtotal) && !isNaN(sdeposit) && !isNaN(swrapprice) && !isNaN(scustomprice) && !isNaN(scoatprice))
    {
             var ntotal = (parseFloat(ssubtotal) + parseFloat(swrapprice) + parseFloat(scustomprice) + parseFloat(scoatprice));
             if(document.frm.scheckpst.checked)
             {
             document.frm.spst.value = parseFloat(ntotal * 8/100).toFixed(2);
             }
         else
         {
         document.frm.spst.value = '0.00';
             }
              if(document.frm.scheckgst.checked)
             {
             document.frm.sgst.value = parseFloat(ntotal * 7/100).toFixed(2);
             }
         else
         {
         document.frm.sgst.value = '0.00';
             }
         document.frm.stotal.value = ((ntotal + parseFloat(document.frm.spst.value) + parseFloat(document.frm.sgst.value)) - parseFloat(sdeposit)).toFixed(2);
             
    }
    else
    {
         alert("Please enter numbers")
         return false;          
    }
   
}
//-->
</SCRIPT>
</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="GetVal()">
<table width="670" border="0" align="center" cellpadding="0" cellspacing="0">
<form NAME="frm">
  <tr>
    <td><table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="190"><img src="images/header_left.gif" width="190" height="60"/></td>
          <td align="center"><img src="images/header_center.gif" width="190" height="60"/></td>
          <td width="200" align="right"><img src="images/header_right.gif" width="200" height="60"/></td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="2"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="5"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="1"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td class="text-black12"><strong>ESTIMATE SHEET</strong></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td align="left" valign="top">
              <table width="470" border="0" cellpadding="0" cellspacing="0" background="images/spacer_blue.gif">
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>CUSTOMER</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td bgcolor="#FFFFFF">
                        <table width="460" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td width="95"><img src="images/spacer.gif" width="95" height="3"/></td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="3"/></td>
                      <td><img src="images/spacer.gif" width="360" height="3"/></td>
                    </tr>
                    <tr>
                        <td width="95" align="right" class="text-black12">Brides
                          Name:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td><input name="sgroupname" type="text" class="forms-360"/></td>
                    </tr>
                    <tr>
                      <td width="95" align="right" class="text-black12">Address:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td><input name="saddress" type="text" class="forms-360"/></td>
                    </tr>
                    <tr>
                      <td width="95" align="right" valign="middle" class="text-black12">City:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td>
                                <table width="360" border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td width="120"><input name="scity" type="text" class="forms-120"/></td>
                            <td width="115" align="right" valign="middle" class="text-black12">Province:</td>
                            <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                            <td width="120"><input name="sprovince" type="text" class="forms-120"/></td>
                          </tr>
                      </table>
                                </td>
                    </tr>
                    <tr>
                      <td width="95" align="right" valign="middle" class="text-black12">Postal Code:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td>
                                <table width="360" border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td width="120"><input name="spostalcode" type="text" class="forms-120"/></td>
                            <td width="115" align="right" class="text-black12">Number In Party:</td>
                            <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                            <td width="120"><input name="snumberinparty" type="text" class="forms-120"/></td>
                          </tr>
                      </table>
                                </td>
                    </tr>
                              <tr>
                      <td width="95" align="right" valign="middle" class="text-black12">Home Phone:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td>
                                <table width="360" border="0" cellspacing="0" cellpadding="0">
                          <tr>
                            <td width="120"><input name="shomephone" type="text" class="forms-120"/></td>
                            <td width="115" align="right" class="text-black12">Business Phone:</td>
                            <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                            <td width="120"><input name="sbusinessphone" type="text" class="forms-120"/></td>
                          </tr>
                      </table>
                                </td>
                    </tr>
                              <tr>
                      <td width="95" align="right" class="text-black12">Brides Email:</td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="5"/></td>
                      <td><input name="sbridesemail" type="text" class="forms-360"/></td>
                    </tr>
                    <tr>
                      <td width="95"><img src="images/spacer.gif" width="95" height="4"/></td>
                      <td width="5"><img src="images/spacer.gif" width="5" height="4"/></td>
                      <td><img src="images/spacer.gif" width="360" height="4"/></td>
                    </tr>
                </table>
                        </td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td><img src="images/spacer.gif" width="1" height="1"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
          </table>
              </td>
          <td width="10"><img src="images/spacer.gif" width="10" height="10"></td>
          <td width="190" align="left" valign="top">
              <table width="190" border="0" cellpadding="0" cellspacing="0" background="images/spacer_blue.gif">
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>WEDDING DAY</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="32" align="center" bgcolor="#FFFFFF"><input name="sweddingdate" type="text" class="forms-180"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
                    <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>CURRENT DAY</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="32" align="center" bgcolor="#FFFFFF"><input name="scurrentdate" type="text" class="forms-180"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
                    <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>DRESS STATUS</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="32" align="center" bgcolor="#FFFFFF"><select name="sstatus" class="forms-180"></select></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td><img src="images/spacer.gif" width="1" height="1"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
          </table>
              </td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="145" align="right" class="text-black12">Bridesmaids Name:</td>
          <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
          <td>
              <table width="520" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200"><input name="sbridesmaidsname" type="text" class="forms-200"/></td>
                <td align="right" class="text-black12">Email Address:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="200"><input name="sbridesmaidsemailaddress" type="text" class="forms-200"/></td>
              </tr>
          </table>
              </td>
        </tr>
        <tr>
          <td width="145" align="right" class="text-black12">Style Number:</td>
          <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
          <td>
              <table width="520" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200"><input name="sstylenumber" type="text" class="forms-200"/></td>
                <td align="right" class="text-black12">Fabric Quality #:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="200"><input name="sfabricqualitynumber" type="text" class="forms-200"/></td>
              </tr>
          </table>
              </td>
        </tr>
        <tr>
          <td width="145" align="right" class="text-black12">Fabric Supplier:</td>
          <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
          <td>
              <table width="520" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="200"><input name="sfabricsupplier" type="text" class="forms-200"/></td>
                <td align="right" class="text-black12">Color Code:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="200"><input name="scolorcode" type="text" class="forms-200"/></td>
              </tr>
          </table>
              </td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td class="text-black12"><input type="radio" name="scustomcheck" value="" onclick="if(this.checked){document.frm.scustomprice.value='0.00';GetVal();}" checked="true">
        Non Custom
        <input type="radio" name="scustomcheck" VALUE="25.00" ONCLICK="if(this.checked){document.frm.scustomprice.value='25.00';GetVal();}">
        Custom</td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="390" align="left" valign="top">
              <table width="390" border="0" cellpadding="0" cellspacing="0" background="images/spacer_blue.gif">
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td height="16" class="text-white12"><strong><img src="images/spacer.gif" width="3" height="16" align="absmiddle"/>PLEASE NOTE:</strong></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td bgcolor="#FFFFFF">
                        <table width="380" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td><img src="images/spacer.gif" width="380" height="5"/></td>
                    </tr>
                    <tr>
                      <td class="text-black12"><strong>BALANCE DUE AT TIME OF PICKUP</strong><br/><img src="images/spacer.gif" width="380" height="5"/><br/>We <strong>DO NOT</strong> take cheques or credit cards for final payments.<br/><img src="images/spacer.gif" width="380" height="10"/><br/><strong><font color="#FF0000"><u>Sorry We Do Not Do Alterations</u></font></strong></td>
                    </tr>
                    <tr>
                      <td><img src="images/spacer.gif" width="380" height="5"/></td>
                    </tr>
                </table>
                        </td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
              <tr>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
                <td><img src="images/spacer.gif" width="1" height="1"/></td>
                <td width="1"><img src="images/spacer.gif" width="1" height="1"/></td>
              </tr>
          </table>
              </td>
          <td width="10"><img src="images/spacer.gif" width="10" height="10"/></td>
          <td width="270" align="left" valign="top">
              <table width="270" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td align="right" class="text-black12">Sub Total:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="ssubtotal" type="text" value="129.99" class="forms-140" onKeyUp="GetVal()"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Wrap Price:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="swrapprice" type="text" value="0.00" onKeyUp="GetVal()" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Custom Price:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="scustomprice" type="text" value="0.00" onKeyUp="GetVal()" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Coat Price:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="scoatprice" type="text" value="0.00" onKeyUp="GetVal()" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">
                        <table width="145" border="0" cellspacing="0" cellpadding="0">
                   <tr>
                     <td width="5"><img src="images/spacer.gif" width="5" height="20"/>
                     <td align="right" class="text-black12">PST:</td>
                               <td width="25" align="center" valign="middle"><input type="checkbox" name="scheckpst" value="0" checked="true" onclick="GetVal();"/></td>
                   </tr>
                 </table>
                         </td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="spst" type="text" value="0.00" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">
                        <table width="145" border="0" cellspacing="0" cellpadding="0">
                   <tr>
                     <td width="5"><img src="images/spacer.gif" width="5" height="20"/>
                     <td align="right" class="text-black12">GST:</td>
                               <td width="25" align="center" valign="middle"><input type="checkbox" name="scheckgst" checked="true" value="0" onclick="GetVal();"/></td>
                   </tr>
                 </table>
                        </td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="sgst" type="text" value="0.00" class="forms-140"/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Less Deposit:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="sdeposit" type="text" class="forms-140" onKeyUp="GetVal()" value=""/></td>
              </tr>
                    <tr>
                <td align="right" class="text-black12">Total:</td>
                <td width="5"><img src="images/spacer.gif" width="5" height="20"/></td>
                <td width="120"><input name="stotal" type="text" value="0.00" class="forms-140" onKeyUp="GetVal()"/></td>
              </tr>
          </table>
              </td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td>
      <table width="670" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="385" height="50"><img src="images/spacer.gif" width="385" height="50"/></td>
          <td width="20" height="50"><img src="images/spacer.gif" width="20" height="50"/></td>
          <td width="265" height="50"><img src="images/spacer.gif" width="265" height="50"/></td>
        </tr>
        <tr>
          <td width="385" bgcolor="#000000"><img src="images/spacer.gif" width="385" height="1"/></td>
          <td width="20" bgcolor="#FFFFFF"><img src="images/spacer.gif" width="20" height="1"/></td>
          <td width="265" bgcolor="#000000"><img src="images/spacer.gif" width="265" height="1"/></td>
        </tr>
        <tr>
          <td width="385" height="20" class="text-black12"><img src="images/spacer.gif" width="10" height="20" align="absmiddle"/>Signature</td>
          <td width="20"><img src="images/spacer.gif" width="20" height="20" align="absmiddle"/></td>
          <td width="265" height="20" class="text-black12"><img src="images/spacer.gif" width="10" height="20" align="absmiddle"/>Date</td>
        </tr>
    </table>
      </td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="3"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="2"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer.gif" width="670" height="5"/></td>
  </tr>
  <tr>
    <td><img src="images/spacer_blue.gif" width="670" height="1"/></td>
  </tr>
</form>
</table>
</body>
</html>
0
 
B_DorseyAuthor Commented:
I am assuming its not giving me a total cause the "Deposit" is empty, but I need it to be empty off the start to force the user to type in if they are accepting a deposit from the client or not.

It has to be empty box off the start no matter what, it cant be 0.00 just blank...

Possible?

Bill D
0
 
hartCommented:
just change ur function GetVal to the below one

function GetVal()
{
    var ssubtotal = document.frm.ssubtotal.value;
    var sdeposit = document.frm.sdeposit.value;
    var swrapprice = document.frm.swrapprice.value;
    var scustomprice = document.frm.scustomprice.value;
     var scoatprice = document.frm.scoatprice.value;
    if(!isNaN(ssubtotal) && !isNaN(sdeposit) && !isNaN(swrapprice) && !isNaN(scustomprice) && !isNaN(scoatprice))
    {            
          var ntotal = (parseFloat(ssubtotal) + parseFloat(swrapprice) + parseFloat(scustomprice) + parseFloat(scoatprice));            
            if(document.frm.scheckpst.checked)
            {
                  document.frm.spst.value = parseFloat(ntotal * 8/100).toFixed(2);
            }
            else
            {
                  document.frm.spst.value = '0.00';
            }
            if(document.frm.scheckgst.checked)
            {
                  document.frm.sgst.value = parseFloat(ntotal * 7/100).toFixed(2);
            }
            else
            {
                  document.frm.sgst.value = '0.00';
            }
            if(sdeposit != '')
            {
                document.frm.stotal.value = ((ntotal + parseFloat(document.frm.spst.value) + parseFloat(document.frm.sgst.value)) - parseFloat(sdeposit)).toFixed(2);
            }
            else
            {
                  document.frm.stotal.value = (ntotal + parseFloat(document.frm.spst.value) + parseFloat(document.frm.sgst.value)).toFixed(2);
            }
           
    }
    else
    {
         alert("Please enter numbers")
         return false;          
    }
   
}

Regards
Hart
0
 
B_DorseyAuthor Commented:
One FINAL request, I promise :)

You know in my code where I have the "Custom" and "Non Custom" radio buttons....

Is it possible that when the default "Non Custom" is checked it shows something below it (some html) and then if you select "Custom" it shows different html and if you go back to "Non Custom" it shows the original?

Thanks
Bill D
0
 
hartCommented:
i was kind of busy, sorry couldn't reply earlier

to do that u  will have to put in layers.
and then dynamically write to the layer..

when non custom then show some text in the layer.
but then if u change the resolution of the page again the position of the layer would be a problem.

is it o necessary ???

Regards
Hart
0
 
B_DorseyAuthor Commented:
Ya probably necesary...

Basically I have two options "Custom" and "Non Custom" when the user has "Non Custom" then I want them to choose a size.

If they choose "Custom" then they have to put their measurements in.

So there is no easy way to show one set of <tr><td></td></tr> tags for one selection and one set for another selection.

So can I just put in an ID tag in each of the <tr> tags and put something like "if tr = this then do this else..."

The page will never be resized ever it will always be full screen on the users browser.

Bill D
0
 
hartCommented:
i meant the resolution, i see the site on 1024, some one might see it on 80x600 and so on.see while using divs's we have to specifiy their postion. and this will vary with resolution....

Regards
Hart
0
 
B_DorseyAuthor Commented:
It will only be seen on one monitor ever. at 1024x768



Bill D
0
 
hartCommented:
paste this code
<tr>
    <td class="text-black12"><input type="radio" name="scustomcheck" value="" onclick="if(this.checked){document.frm.scustomprice.value='0.00';document.getElementById('nc').style.display = 'block';document.getElementById('c').style.display = 'none';GetVal();}" checked>
        Non Custom
        <input type="radio" name="scustomcheck" VALUE="25.00" ONCLICK="if(this.checked){document.frm.scustomprice.value='25.00';document.getElementById('nc').style.display = 'none';document.getElementById('c').style.display = 'block';GetVal();}">
        Custom</td>
  </tr>
  <TR ID="nc" STYLE="display:block">
        <TD class="text-black12">choose a size <select name="csize"><option value="1">1</option><option value="1">2</option></SELECT></TD>
  </TR>
  <TR ID="c" STYLE="display:none">
        <TD class="text-black12">Measurements in <input type="text" name="measurements" value="" class="forms-200"></TD>
  </TR>


in your html code instead of
<tr>
    <td class="text-black12"><input type="radio" name="scustomcheck" value="" onclick="if(this.checked){document.frm.scustomprice.value='0.00';GetVal();}" checked="true">
        Non Custom
        <input type="radio" name="scustomcheck" VALUE="25.00" ONCLICK="if(this.checked){document.frm.scustomprice.value='25.00';GetVal();}">
        Custom</td>
  </tr>


Regards
Hart
0
 
B_DorseyAuthor Commented:
YOU ARE THE MAN !


Thanks very much ..... GREATLY APPRECIATED

THANKS, THANKS, THANKS


Bill D
0
 
hartCommented:
:-)

regards
hart
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.