Skip navigation
miah_biosc
Currently Being Moderated

Submit form, thankyou page, calculating total HELP!

Apr 12, 2012 7:03 PM

Hi after searching every forum, discussion and answers to similar questions in the whole universe of the internet I am still stuck!! I have tried just about everything so if someone can help and educate me on this matter I will be beyond happy you will have made my day!!!

 

I have several questions I'll try make them as straight forward as I can....

 

I have created a form which has several fields, one of which requires a calculation (litres of product * cost per litre) to produce total payable. which I want to appear near bottom before credit card details. Sounds simple? APARENTLY NOT!!! 

 

I want my submit button to submit all fields to email and then produce a thank you page (which I have created)

 

I also want to know more about securing this page (ie security certificates?) so that people can enter credit card details.

 

Sounds simple but my uneducated web design brain cannot work it out!!!!!!!!!!! Please help!

 

My form codes:

 

<p><strong>Bioprime Order Form</strong> 
  <p align="Left">
  <form method=post action="/cgi-bin/example.cgi">
  Name <br>
  <input type="text" size="100" maxlength="150">
  <p>
  Address <br>
  <input type="text" size="100" maxlength="150"><br />
  <font face="Arial" size="1">Please Note: Invoice will be sent to this address</font>
  <p>
  Contact Numbers <br> Home  <input type="text" size="30" maxlength="12">
  <br>Work   <input type="text" size="30" maxlength="12">
  <br>Mobile <input type="text" size="30" maxlength="12"><br>
  <p>
  Amount required<br><input type="text" size="30" maxlength="8" id= "amount" > Litres  <br><br>
  Date required<br><input type="text" size="30" maxlength="12"><br>
  <font face="Arial" size="1">Please be advised there is a minimum product availability time of X days </font> <br>
  <br>Date of pickup<br><input type="text" size="30" maxlength="12"><br>
  <br>
  Total amount Payable: $<br>
  <br>Credit Card Details<br>
    Name on Card <input type="text" size="30" maxlength="12"> <br>
    Card Number   <input type="text" size="30" maxlength="12">
    Expiry Date <input type="text" size="10" maxlength="12">
    CCV <input type="text" size="10" maxlength="12"><br>
  <p>
  <br><input type="Submit" value="Submit"   />


  </form>

 
Replies
  • Currently Being Moderated
    Apr 12, 2012 9:13 PM   in reply to miah_biosc

    I have several questions I'll try make them as straight forward as I can....

    Not a good idea. One question per post is more than sufficient thank you.

    I have created a form which has several fields, one of which requires a calculation (litres of product * cost per litre) to produce total payable. which I want to appear near bottom before credit card details. Sounds simple? APARENTLY NOT!!! 

    APPARENTLY YES!!! Have a look at the following

    <!doctype html>

    <html>

    <head>

    <meta charset="utf-8">

    <title>Untitled Document</title>

    <style>

    #orderform label {width: 160px; float: left; display: block;}

    </style>

    </head>

     

    <body>

    <h2>Bioprime Order Form</h2>

    <form method=post action="" name="orderform" id="orderform">

      <p>

        <label for="amount">Amount required:</label>

        <input type="text" size="7" name="amount" id="amount" value="0" onChange="calculate_product_totalcost()"> Litres

      </p>

      <p>

          <label for="product_cost_display">Total amount Payable:</label>

        <input type="text" name="product_cost_display" id="product_totalcost_display" size="7" value="0" onFocus="this.blur()"><br>

        </p>

      <p>

          <input name="calculate" type="button" value="Calculate">

      </p>

    </form>

    <script>

    function calculate_product_totalcost() {

        var xForm = document.forms["orderform"];

        var litres = xForm.amount.value;

        var itemcost = 23.50; /* cost of the product */

        var totalcost = litres * itemcost;

        xForm.product_totalcost_display.value = "$ "+totalcost.toFixed(2);

    }

    </script>

    </body>

    </html>

     

     

    I want my submit button to submit all fields to e-mail and then produce a thank you page (which I have created)

     

    I do not know what you have got here cgi-bin/example.cgi. A better approach is to use server side code like PHP to process the form. That way you can stay with the same page which will include the thank you message. Have a look at how this guy did it http://www.linecraft.com/spry_data_utils/videos/sending_spry_email.php

    I also want to know more about securing this page (ie security certificates?) so that people can enter credit card details.

    Please take my advice and do not mess with credit card details, just give the likes of PayPal the privilege.

     

    Gramps

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 12, 2012 10:19 PM   in reply to miah_biosc

    Add the highlighted

    <form method=post action="/cgi-bin/example.cgi" name="orderform" id="orderform">

    Gramps

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points