Solved

Add Value Of Text Boxes Together

Posted on 2003-10-28
29
460 Views
Last Modified: 2008-04-21
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
0
Comment
Question by:B_Dorsey
  • 14
  • 12
  • 2
  • +1
29 Comments
 
LVL 11

Accepted Solution

by:
hart earned 500 total points
ID: 9632881
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9632917
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
 
LVL 5

Expert Comment

by:alambres
ID: 9633024
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
 
LVL 11

Expert Comment

by:hart
ID: 9633036
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
 
LVL 12

Expert Comment

by:ahosang
ID: 9633071
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
 
LVL 5

Expert Comment

by:alambres
ID: 9633072
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9638603
@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
 
LVL 11

Expert Comment

by:hart
ID: 9639484
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9639518
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
 
LVL 11

Expert Comment

by:hart
ID: 9639580
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9639654
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
 
LVL 11

Expert Comment

by:hart
ID: 9639742
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9639788
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9639792
I have to tell ya, Ive never used Java really before, just so you know where my knowledge of it is :)

Bill D
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
LVL 11

Expert Comment

by:hart
ID: 9639847
sorry forget my earlier post i will give u a new code :-)

Regards
Hart
0
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9639896
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
 
LVL 11

Expert Comment

by:hart
ID: 9639901
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9639985
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9640001
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
 
LVL 11

Expert Comment

by:hart
ID: 9640128
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9640176
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
 
LVL 11

Expert Comment

by:hart
ID: 9640637
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9640670
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
 
LVL 11

Expert Comment

by:hart
ID: 9640748
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9640763
It will only be seen on one monitor ever. at 1024x768



Bill D
0
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9640792
0
 
LVL 11

Expert Comment

by:hart
ID: 9641009
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
 
LVL 14

Author Comment

by:B_Dorsey
ID: 9641040
YOU ARE THE MAN !


Thanks very much ..... GREATLY APPRECIATED

THANKS, THANKS, THANKS


Bill D
0
 
LVL 11

Expert Comment

by:hart
ID: 9641097
:-)

regards
hart
0

Featured Post

Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

Join & Write a Comment

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now