7 Replies Latest reply: Aug 10, 2012 10:49 PM by gofer RSS

    order form that updates quantities

    gofer Community Member

      Hi,

      I've been asked by a client to have a product order page, it doesn't require e-commerce, I guess it would be some sort of PHP feedback form, as the viewer clicks on the product and then the quantity field is automatically updated with the correct dollar amount. The viewer would then just click send and the order is manually processed back at my client's shop.

      Any ideas?

      Thanks.

        • 1. Re: order form that updates quantities
          Ben Pleysier MVP

          There are two ways of doing what you want

          1. Serverside script (PHP), which requires a page refresh when a quantity is/needs to be updated

          2. Clientside script (JS) that updates without a page refresh.

           

          See http://shoguncarco.com.au/index.php?page=costcalculator for a working example of the latter.

           

          Gramps

          • 2. Re: order form that updates quantities
            gofer Community Member

            Thanks for that, probably go the JS way.

            Cheers

            • 3. Re: order form that updates quantities
              Ben Pleysier MVP

              If you want a more personalised answer, please supply a link to your site.

               

              Gramps

              • 4. Re: order form that updates quantities
                gofer Community Member

                Thanks for that Gramps, only local site at this stage, may need your advise later if I may.

                Cheers

                • 5. Re: order form that updates quantities
                  gofer Community Member

                  Sorry Gramps, I've tried to work this out but I'm out of my depth, this what I'm trying to achieve, see below.

                  Would appreciate your help, thank you.

                   

                   

                  dynamic-order-form.jpg

                  • 6. Re: order form that updates quantities
                    Ken Binney MVP

                    Screen shots are of no value.

                    PLEASE put your test files online and post a link for us

                    • 7. Re: order form that updates quantities
                      gofer Community Member

                      Sorry I've been slow getting back, other distractions I'm afraid.

                      This is the code for a form I found on the net but after much experimenting I can't get the case price option to work.

                      Would be very grateful if someone can "show me the way"

                      Thanks.

                       

                      <html>

                      <head>

                      <META NAME="DESCRIPTION" CONTENT="javascript examples with source code">

                      <META NAME="KEYWORDS" CONTENT="java, script, javascript, examples, source, code, forms, games">

                      <META NAME="AUTHOR" CONTENT="Uncle Jim's Web Site Designs">

                      <SCRIPT LANGUAGE="javascript" TYPE="text/javascript">

                      <!-- Original:  Mike McGrath   (mike_mcgrath@lineone.net) -->

                      <!-- Web Site:  http://website.lineone.net/~mike_mcgrath/ -->

                      <!--

                       

                       

                      function count(f,n,u)

                      {

                        f.line_sum[n].value = f.line[n].value * u;

                        f.line_sum[n].value = Math.ceil(f.line_sum[n].value * 1000) /1000;

                        f.line_sum[n].value = Math.floor(f.line_sum[n].value * 1000) /1000;

                        f.line_sum[n].value = Math.round(f.line_sum[n].value * 100)/100;

                        if(f.line_sum[n].value == "NaN")

                        {

                          alert("Error:\nYou may only enter numbers...\nPlease retry");

                          f.line[n].value = f.line[n].value.substring(0, f.line[n].value.length-1);

                          f.line_sum[n].value = f.line[n].value * u;

                          if(f.line_sum[n].value == "0") f.line_sum[n].value = "";

                        }

                        else

                        {

                          var gt = 0;

                          for(i=0; i < f.line_sum.length; i++)

                          {

                            gt += Math.ceil(f.line_sum[i].value * 1000) /1000;

                          }

                          gt = Math.round(gt * 1000)/1000;

                          f.grand_total.value = "$ " + gt;

                          decimal(f);

                         }

                      }

                       

                       

                      function get_data(f)

                      {

                        var order_data = "This Order is ...\n";

                        for(i=0; i < f.line.length; i++)

                        {

                          if(f.line[i].value == "") f.line[i].value = "0";

                          order_data += "Line " +i+ " = "+f.line[i].value +" Qty\n";

                        }

                        if(f.grand_total.value == "") f.grand_total.value = "Nil";

                        order_data += "Total Order Value = " + f.grand_total.value;

                        document.g.order.value = order_data;

                      }

                       

                       

                      function decimal(f)

                      {

                        for(i=0; i<f.line_sum.length; i++)

                        {

                          var d = f.line_sum[i].value.indexOf(".");

                          if(d == -1 && f.line[i].value != 0) f.line_sum[i].value += ".00";

                          if(d == (f.line_sum[i].value.length-2)) f.line_sum[i].value += "0";

                          if(f.line_sum[i].value == "00") f.line_sum[i].value="";

                        }

                        d = f.grand_total.value.indexOf(".");

                        if(d == -1) f.grand_total.value += ".00";

                        if(d == (f.grand_total.value.length-2)) f.grand_total.value += "0";

                      }

                       

                       

                      function send_data(g)

                      {

                        get_data(document.f);

                        if(document.f.grand_total.value == "Nil")

                        {

                          var conf = confirm("No items are entered - \nDo you want to submit a blank order?");

                          if(conf)g.submit(); else init();

                        }

                        else g.submit();

                      }

                       

                       

                      function init()

                      {

                        document.f.reset();

                        document.f.line[0].select();

                        document.f.line[0].focus();

                        document.g.order.value="";

                      }

                       

                       

                      window.onload=init;

                       

                       

                      // -->

                      </SCRIPT>

                       

                       

                       

                       

                      </head>

                      <body>

                      <FORM NAME="f">

                      <TABLE BGCOLOR="mistyrose" BORDER="2" WIDTH="905" CELLPADDING="5" CELLSPACING="0" SUMMARY=""><TBODY>

                      <TR><TD COLSPAN="6" ALIGN="center"><B>Order Form</B></TD></TR><TR BGCOLOR="beige">

                      <TD width="97"><U>Item</U></TD><TD width="64"><U>Qty</U></TD><TD width="97"><U>Each</U></TD>

                      <TD width="127" ALIGN="right">number of full cases</TD>

                      <TD width="81" ALIGN="right">price per case</TD>

                      <TD width="363" ALIGN="right"><U>Total</U></TD></TR>

                      <TR><TD>Line 0</TD>

                      <TD><INPUT NAME="line" TYPE="text" SIZE="5" VALUE="" ONKEYUP="count(this.form,0,5.95)"></TD>

                      <TD>$ 5.95</TD>

                      <TD ALIGN="right"><INPUT NAME="line" TYPE="text" SIZE="5" VALUE="" ONKEYUP="count(this.form,0,105.95)"></TD>

                      <TD>$ 105.95</TD></TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"><INPUT NAME="line_sum" TYPE="text" SIZE="10" READONLY></TD></TR>

                      <TR BGCOLOR="beige">

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                       

                      <TD>Line 1</TD>

                      <TD><INPUT NAME="line" TYPE="text" SIZE="5" VALUE="" ONKEYUP="count(this.form,1,10.95)">

                      </TD>

                      <TD>$ 10.95</TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"><INPUT NAME="line_sum" TYPE="text" SIZE="10" READONLY></TD></TR>

                      <TR><TD>Line 2</TD><TD><INPUT NAME="line" TYPE="text" SIZE="5" VALUE="" ONKEYUP="count(this.form,2,20.95)">

                      </TD><TD>$ 20.95</TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"><INPUT NAME="line_sum" TYPE="text" SIZE="10" READONLY></TD></TR>

                      <TR BGCOLOR="beige"><TD><INPUT TYPE="button" VALUE="Reset" ONCLICK="init()"></TD>

                      <TD COLSPAN="2" ALIGN="right"><U>Grand Total :</U></TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"> </TD>

                      <TD ALIGN="right"><INPUT NAME="grand_total" TYPE="text" SIZE="10" READONLY></TD></TR>

                      <TR><TD COLSPAN="6" ALIGN="center"><INPUT TYPE="button" VALUE="Press to Verify Order" ONCLICK="get_data(this.form)"></TD></TR></TBODY></TABLE></FORM>

                      <FORM NAME="g" METHOD="post" ENCTYPE="text/plain" ACTION="mailto:user@isp">

                      <TABLE BGCOLOR="cadetblue" BORDER="4" WIDTH="320" CELLPADDING="5" CELLSPACING="0" SUMMARY="">

                      <TBODY><TR><TD ALIGN="center"><TEXTAREA NAME="order" ROWS="5" COLS="35">

                      </html>