Web Analytics Made Easy - StatCounter text box input prompts calculation in another text box - CodingForum

Announcement

Collapse
No announcement yet.

text box input prompts calculation in another text box

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    text box input prompts calculation in another text box

    I have a portion of an online menu that I require assistance with. The user should be able to enter the number of items they wish in the "quantity" text box and in the "SUBTOTAL" text box, the subtotal $$ amount of items should appear and should be uneditable by the user. For example, if the user inputs 2 for quantity next to Hamburger, the amount $5.98 should automatically be placed in the Sub-Total column. The code is below for reference. Thank you for any assistance.



    <html>
    <script language="javascript">
    function checkmenu(){
    while(document.form2.tb1.value=="" && document.form2.tb2.value=="" && document.form2.tb3.value=="" && document.form2.tb4.value=="" && document.form2.tb5.value=="" && document.form2.tb6.value=="")
    {
    alert("You must order at least one item");
    a=confirm("Click ok to continue. Click cancel to exit")
    if(a==false) {
    break;
    }
    }
    }

    function evalmenu(){

    var hamburger=(document.form2.tb1.value != '') ?
    eval(document.form2.tb1.value) : 0;

    var cheeseburger=(document.form2.tb2.value != '') ?
    eval(document.form2.tb2.value) : 0;

    var chickenburger=(document.form2.tb3.value != '') ?
    eval(document.form2.tb3.value) : 0;

    var fries=(document.form2.tb4.value != '') ?
    eval(document.form2.tb4.value) : 0;

    var gravy=(document.form2.tb5.value != '') ?
    eval(document.form2.tb5.value) : 0;

    var chili=(document.form2.tb6.value != '') ?
    eval(document.form2.tb6.value) : 0;

    document.form2.tb7.value=hamburger+cheeseburger+chickenburger+fries+gravy+chili;

    var subtotal=document.form2.tb7.value
    var tax=.07

    var pst=(document.form2.tb8.value=subtotal * tax) ?
    eval(document.form2.tb8.value): 0;
    document.form2.tb8.value=Math.round(pst*100)/100;

    var gst=(document.form2.tb9.value=subtotal * tax) ?
    eval(document.form2.tb9.value): 0;
    document.form2.tb9.value=Math.round(gst*100)/100;

    document.form2.tb10.value=eval(subtotal+"+"+pst+"+"+gst);
    document.form2.tb10.value=Math.round(document.form2.tb10.value*100)/100;


    }
    </script>
    <body>
    <form name="form2">
    <TABLE>
    <TBODY></TBODY></TABLE>
    <TABLE cellSpacing=5 border=0>
    <TBODY>
    <TR>
    <TD align=middle><B>item</B> </TD>
    <TD><B>price</B> </TD>
    <TD><B>quantity</B> </TD>
    <TD><B>sub-total</B> </TD>
    <TD>&nbsp;</TD>
    <TD><B>item</B> </TD>
    <TD><B>price</B> </TD>
    <TD><B>quantity</B> </TD>
    <TD><B>sub-total</B> </TD></TR>
    <TR>
    <TD>Hamburger</TD>
    <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6 value=$2.99
    ;> </TD>
    <TD align=left><INPUT maxLength=3 size=3 name="quantity1"></TD>
    <TD align=left><INPUT maxLength=6 size=6 name=tb1></TD>
    <TD>&nbsp;</TD>
    <TD>French <BR>Fries</TD>
    <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
    value=$2.99></TD>
    <TD align=left><INPUT maxLength=3 size=3 name="quantity2"></TD>
    <TD align=left><INPUT maxLength=6 size=6 name=tb4></TD></TR>
    <TR>
    <TD align=middle>Cheeseburger</TD>
    <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
    value=$3.99></TD>
    <TD align=left><INPUT maxLength=3 size=3 name="quantity3"></TD>
    <TD align=left><INPUT maxLength=6 size=6 name=tb2></TD>
    <TD>&nbsp;</TD>
    <TD><INPUT type=checkbox> gravy</TD>
    <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
    value=$0.50></TD>
    <TD align=left><INPUT maxLength=3 size=3 name="quantity4"></TD>
    <TD align=left><INPUT maxLength=6 size=6 name=tb5></TD></TR>
    <TR>
    <TD>Chicken <BR>Burger</TD>
    <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
    value=$4.99></TD>
    <TD align=left><INPUT maxLength=3 size=3 name="quantity5"></TD>
    <TD align=left><INPUT maxLength=6 size=6 name=tb3></TD>
    <TD>&nbsp;</TD>
    <TD><INPUT type=checkbox> chili</TD>
    <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
    value=$1.99></TD>
    <TD align=left><INPUT maxLength=3 size=3 name="quantity6"></TD>
    <TD align=left><INPUT maxLength=6 size=6 name=tb6></TD></TR>
    <TR>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>subtotal
    <TD><INPUT readOnly maxLength=6 size=5 name=tb7></TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TR>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>pst</TD>
    <TD><INPUT readOnly maxLength=6 size=5 name=tb8></TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TR>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD align=left>gst</TD>
    <TD><INPUT readOnly maxLength=6 size=5 name=tb9></TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TR>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD align=left>Total<MAXLENGTH< td>
    <TD><INPUT readOnly maxLength=8 size=5 name=tb10></TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TR>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD>&nbsp;</TD>
    <TD align=middle colSpan=2><INPUT onclick="checkmenu(); evalmenu()" type=button value="total up order" name=tb11>

    <TD></TD></TH></TD></TD></TR></TBODY></TABLE><BR>
    <HR width="80%">
    <BR></FORM>
    </body>
    </html>
    Tags: None
  • #2
    Nevermind. I figured it out. Thanks anyway!!!

    Comment

    • #3
      Oh well, I got this far with it so you might as well have it




      <html>
      <script language="javascript">

      function check_menu(){
      subtotal=0

      document.form2.tb1.value = document.form2.cost1.value * document.form2.quantity1.value
      document.form2.tb2.value = document.form2.cost2.value * document.form2.quantity2.value
      document.form2.tb3.value = document.form2.cost3.value * document.form2.quantity3.value
      document.form2.tb4.value = document.form2.cost4.value * document.form2.quantity4.value
      document.form2.tb5.value = document.form2.cost5.value * document.form2.quantity5.value
      document.form2.tb6.value = document.form2.cost6.value * document.form2.quantity6.value

      for(i=1;i<7;i++){ // check for valid number
      if(isNaN(document.form2["quantity"+i].value)){
      alert("Please enter a valid number in "+document.form2["quantity"+i].id)
      }
      }

      for(i=1;i<7;i++){
      subtotal+=document.form2["tb"+i].value*1
      }

      document.form2.stotal. value=subtotal

      var tax=.07

      document.form2.pst.value=(subtotal * tax).toFixed(2)

      document.form2.gst.value=(subtotal * tax).toFixed(2)

      document.form2.total.value=(subtotal+(subtotal * tax)+(subtotal * tax)).toFixed(2)

      }
      </script>
      <body>
      <form name="form2">Lisawynn
      <TABLE>
      <TBODY></TBODY></TABLE>
      <TABLE cellSpacing=5 border=0>
      <TBODY>
      <TR>
      <TD align=middle><B>item</B> </TD>
      <TD><B>price</B> </TD>
      <TD><B>quantity</B> </TD>
      <TD><B>sub-total</B> </TD>
      <TD> </TD>
      <TD><B>item</B> </TD>
      <TD><B>price</B> </TD>
      <TD><B>quantity</B> </TD>
      <TD><B>sub-total</B> </TD></TR>
      <TR>
      <TD>Hamburger</TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="cost1" value=2.99 readOnly> </TD>
      <TD align=left><INPUT type="text" maxLength=3 size=3 name="quantity1" id="Hamburger"></TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="tb1" readOnly></TD>
      <TD> </TD>
      <TD>French <BR>Fries</TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="cost4" value=2.99 readOnly></TD>
      <TD align=left><INPUT type="text" maxLength=3 size=3 name="quantity4" id="Fries"></TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name=tb4 readOnly></TD></TR>
      <TR>
      <TD align=middle>Cheeseburger</TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="cost2" value=3.99 readOnly></TD>
      <TD align=left><INPUT type="text" maxLength=3 size=3 name="quantity2" id="Cheeseburger"></TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name=tb2 readOnly></TD>
      <TD> </TD>
      <TD><INPUT type=checkbox> gravy</TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="cost5" value=0.50 readOnly></TD>
      <TD align=left><INPUT type="text" maxLength=3 size=3 name="quantity5" id="Gravy"></TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name=tb5 readOnly></TD></TR>
      <TR>
      <TD>Chicken <BR>Burger</TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="cost3" value=4.99 readOnly></TD>
      <TD align=left><INPUT type="text" maxLength=3 size=3 name="quantity3" id="Chickenburger"></TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name=tb3 readOnly></TD>
      <TD> </TD>
      <TD><INPUT type=checkbox> chili</TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name="cost6" value=1.99 readOnly></TD>
      <TD align=left><INPUT type="text" maxLength=3 size=3 name="quantity6" id="Chilli"></TD>
      <TD align=left><INPUT type="text" maxLength=6 size=6 name=tb6></TD></TR>
      <TR>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TD>Subtotal
      <TD><INPUT type="text" readOnly maxLength=6 size=5 name="stotal"></TD>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TR>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TD>pst</TD>
      <TD><INPUT type="text" readOnly maxLength=6 size=5 name="pst"></TD>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TR>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TD align=left>gst</TD>
      <TD><INPUT type="text" readOnly maxLength=6 size=5 name="gst"></TD>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TR>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TD align=left>Total</td>
      <TD><INPUT type="text" readOnly maxLength=8 size=5 name="total"></TD>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TR>
      <TD> </TD>
      <TD> </TD>
      <TD> </TD>
      <TD align=middle colSpan=2><INPUT onclick="check_menu()" type=button value="total up order" name=tb11>

      <TD></TD></TH></TD></TD></TR></TBODY></TABLE><BR>
      <HR width="80%">
      <BR></FORM>
      </body>
      </html>
      The silent one.

      The most dangerous thing in the world is an idea.
      The most dangerous person in the world is the one with an idea.

      Comment

      • #4
        Thanks very much for your input. Sorry about that. Here is what I came up with:


        <html>
        <script language="javascript">
        function checkmenu(){
        while(document.form2.tb1.value=="" && document.form2.tb2.value=="" && document.form2.tb3.value=="" && document.form2.tb4.value=="" && document.form2.tb5.value=="" && document.form2.tb6.value=="")
        {
        alert("You must order at least one item");
        a=confirm("Click ok to continue. Click cancel to exit")
        if(a==false) {
        break;
        }
        }
        }

        //new portion to subtotal menu
        function subtotalmenu(){
        var hamorder=(document.form2.quantity1.value != '') ?
        eval(document.form2.quantity1.value) :0;

        var cheeseorder=(document.form2.quantity3.value != '') ?
        eval(document.form2.quantity3.value) :0;

        var chickenorder=(document.form2.quantity5.value != '') ?
        eval(document.form2.quantity5.value) :0;

        var friesorder=(document.form2.quantity2.value != '') ?
        eval(document.form2.quantity2.value) :0;

        var gravyorder=(document.form2.quantity4.value != '') ?
        eval(document.form2.quantity4.value) :0;

        var chiliorder=(document.form2.quantity6.value != '') ?
        eval(document.form2.quantity6.value) :0;

        document.form2.tb1.value=hamorder*2.99;
        document.form2.tb2.value=cheeseorder*3.99;
        document.form2.tb3.value=chickenorder*4.99;
        document.form2.tb4.value=friesorder*2.99;
        document.form2.tb5.value=gravyorder*.50;
        document.form2.tb6.value=chiliorder*1.99;
        }

        function evalmenu(){

        var hamburger=(document.form2.tb1.value != '') ?
        eval(document.form2.tb1.value) : 0;

        var cheeseburger=(document.form2.tb2.value != '') ?
        eval(document.form2.tb2.value) : 0;

        var chickenburger=(document.form2.tb3.value != '') ?
        eval(document.form2.tb3.value) : 0;

        var fries=(document.form2.tb4.value != '') ?
        eval(document.form2.tb4.value) : 0;

        var gravy=(document.form2.tb5.value != '') ?
        eval(document.form2.tb5.value) : 0;

        var chili=(document.form2.tb6.value != '') ?
        eval(document.form2.tb6.value) : 0;

        document.form2.tb7.value=hamburger+cheeseburger+chickenburger+fries+gravy+chili;

        var subtotal=document.form2.tb7.value
        var tax=.07

        var pst=(document.form2.tb8.value=subtotal * tax) ?
        eval(document.form2.tb8.value): 0;
        document.form2.tb8.value=Math.round(pst*100)/100;

        var gst=(document.form2.tb9.value=subtotal * tax) ?
        eval(document.form2.tb9.value): 0;
        document.form2.tb9.value=Math.round(gst*100)/100;

        document.form2.tb10.value=eval(subtotal+"+"+pst+"+"+gst);
        document.form2.tb10.value=Math.round(document.form2.tb10.value*100)/100;


        }
        </script>
        <body>
        <form name="form2">
        <TABLE>
        <TBODY></TBODY></TABLE>
        <TABLE cellSpacing=5 border=0>
        <TBODY>
        <TR>
        <TD align=middle><B>item</B> </TD>
        <TD><B>price</B> </TD>
        <TD><B>quantity</B> </TD>
        <TD><B>sub-total</B> </TD>
        <TD>&nbsp;</TD>
        <TD><B>item</B> </TD>
        <TD><B>price</B> </TD>
        <TD><B>quantity</B> </TD>
        <TD><B>sub-total</B> </TD></TR>
        <TR>
        <TD>Hamburger</TD>
        <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6 value=$2.99
        ;> </TD>
        <TD align=left><INPUT maxLength=3 size=3 name="quantity1"></TD>
        <TD align=left><INPUT maxLength=6 size=6 name=tb1></TD>
        <TD>&nbsp;</TD>
        <TD>French <BR>Fries</TD>
        <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
        value=$2.99></TD>
        <TD align=left><INPUT maxLength=3 size=3 name="quantity2"></TD>
        <TD align=left><INPUT maxLength=6 size=6 name=tb4></TD></TR>
        <TR>
        <TD align=middle>Cheeseburger</TD>
        <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
        value=$3.99></TD>
        <TD align=left><INPUT maxLength=3 size=3 name="quantity3"></TD>
        <TD align=left><INPUT maxLength=6 size=6 name=tb2></TD>
        <TD>&nbsp;</TD>
        <TD><INPUT type=checkbox> gravy</TD>
        <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
        value=$0.50></TD>
        <TD align=left><INPUT maxLength=3 size=3 name="quantity4"></TD>
        <TD align=left><INPUT maxLength=6 size=6 name=tb5></TD></TR>
        <TR>
        <TD>Chicken <BR>Burger</TD>
        <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
        value=$4.99></TD>
        <TD align=left><INPUT maxLength=3 size=3 name="quantity5"></TD>
        <TD align=left><INPUT maxLength=6 size=6 name=tb3></TD>
        <TD>&nbsp;</TD>
        <TD><INPUT type=checkbox> chili</TD>
        <TD align=left><INPUT onfocus=this.blur() maxLength=6 size=6
        value=$1.99></TD>
        <TD align=left><INPUT maxLength=3 size=3 name="quantity6"></TD>
        <TD align=left><INPUT maxLength=6 size=6 name=tb6></TD></TR>
        <TR>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>subtotal
        <TD><INPUT readOnly maxLength=6 size=5 name=tb7></TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TR>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>pst</TD>
        <TD><INPUT readOnly maxLength=6 size=5 name=tb8></TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TR>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD align=left>gst</TD>
        <TD><INPUT readOnly maxLength=6 size=5 name=tb9></TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TR>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD align=left>Total<MAXLENGTH< td>
        <TD><INPUT readOnly maxLength=8 size=5 name=tb10></TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TR>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD>&nbsp;</TD>
        <TD align=middle colSpan=2><INPUT onclick=" subtotalmenu(); checkmenu(); evalmenu()" type=button value="total up order" name=tb11>

        <TD></TD></TH></TD></TD></TR></TBODY></TABLE><BR>
        <HR width="80%">
        <BR></FORM>
        </body>
        </html>

        Comment

        • #5
          Thats ok, I hope you don't mind me pointing out a couple of things but you should not really be using the eval() method as it is neither needed or an efficient way.

          You are also running 3 functions at the same time that depend on results from each other this in itself could cause a glitch if one function has not done the calculations that the other requires.

          All the if/else statements are not needed either
          The silent one.

          The most dangerous thing in the world is an idea.
          The most dangerous person in the world is the one with an idea.

          Comment

          • #6
            I don't mind. I just started taking classes at the beginning of this January so I am a VERY new newbie to JavaScript or any other kind of programming. I guess it takes awhile. Its probably very difficult for someone that is experienced to look at newbie code and not cringe. Thanks for being gentle though.

            Comment

            Previous template Next
            Working...
            X