Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Aug 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Shipping costs, based on the text field input

    Hello,

    I am making a site for our restaurant. Customers can order online. The order will be send to our email address.

    On the site I have a table of items and prices. Also I have a javascript that gets the prices from the first column (name & price of an Article are in 1 column). The right column are text boxes. At the end of my page is a cell that automatically (also javascript) is the sum of the cost. This cost is compied to another textbox (read only).
    [id = "Order_totalb"]


    At the end the customer is required to fill in his address.

    / / So far I have programmed everything in my html file. / /
    -------

    1.1) We supply from 15 in Eeklo. This + 3 transport.
    If the order is greater than or equal to 20, then the transport cost 0.

    1.2) If the total of the accumulated amount, so Order_totalb.value is less than or equal to 14, then get an alert 'minimum 15 euros ".

    2) Outside Eeklo we provide from 20 + 3 transport.
    If the order (outside Eeklo) is greater or equal to 20, then the transport cost 0.

    2.1) If the total of the accumulated amount, so Order_totalb.value is less than or equal to 19, then get an alert 'minimum 20 euros ".

    3) The municipalities 'knesselare, Bassevelde, Lovendegem, Maldegem' (these are towns in Belgium) have their own rate. namely: we deliver to there from 25 + 3 transport.

    3.1) If the total of the accumulated amount, so Order_totalb.value is less than or equal to 24, then an alert should be "25 euro".

    Now to know which transport costs are to be used I would like values ​​linked to the text field.

    [from 15 in Eeklo. This transport + 3]
    Eeklo

    [Outside Eeklo we provide from 20 + 3 transport.]
    Ursel
    Zomergem
    Waarschoot
    Oosteeklo
    Kaprijke
    Lembeke
    St. Laureins
    Adegem

    [knesselare, Bassevelde, lovendegem, maldegem "have its own rate]
    Knesselare
    Lovendegem
    Bassevelde
    Maldegem

    -
    MY QUESTION FOLLOWS:

    I have the following fields that links must explain: "city" (plaats), "Order_total" and "transport"

    If the customer enter "Ursel" for instance in the city field (the place name is automatically put in uppercase), then it should alert ("minimum 20 euro") when total_Order.value is less than or equal to 19 [see 2.1)] and also the transportation costs have to written to the textfield "transport".

    So I need a script that compares with the city.value; each with their own costs.

    I thought of something: if.city.value = EEKLO
    and if Order_total.value <= 15
    than transportation_cost.value = "3"
    else if
    transportation_cost.value = ""

    than this for each city separately I think.

    Thank you!
    Dyasten

    [hint: if you have the total in the table, then move your mouse over that total to see it appea in textbox "totaal bedrag"]

    Code:
    <!DOCTYPE html> 
    <html> 
    <head> 
    
    <title> 
    Bestel nu: 
    </title> 
    
    <!-- Meta Tags --> 
    <meta charset="utf-8"> 
    
    
    <!-- CSS --> 
    
    
    <!-- JavaScript --> 
    
    
    <SCRIPT TYPE="text/javascript"> 
    <!-- 
    // copyright 1999 Idocs, Inc. http://www.idocs.com 
    // Distribute this script freely but keep this notice in place 
    function numbersonly(myfield, e, dec) 
    { 
    var key; 
    var keychar; 
    
    if (window.event) 
    key = window.event.keyCode; 
    else if (e) 
    key = e.which; 
    else 
    return true; 
    keychar = String.fromCharCode(key); 
    
    // control keys 
    if ((key==null) || (key==0) || (key==8) || 
    (key==9) || (key==13) || (key==27) ) 
    return true; 
    
    // numbers 
    else if ((("0123456789").indexOf(keychar) > -1)) 
    return true; 
    
    // decimal point jump 
    else if (dec && (keychar == ".")) 
    { 
    myfield.form.elements[dec].focus(); 
    return false; 
    } 
    else 
    return false; 
    } 
    
    //--> 
    </SCRIPT> 
    
    <script language="JavaScript" type="text/javascript"> 
    <!-- 
    
    /* This script is Copyright (c) Paul McFedries and 
    Logophilia Limited (http://www.mcfedries.com/). 
    Permission is granted to use this script as long as 
    this Copyright notice remains in place.*/ 
    
    function CalculateTotal(frm) { 
    var order_total = 0 
    
    // Run through all the form fields 
    for (var i=0; i < frm.elements.length; ++i) { 
    
    // Get the current field 
    form_field = frm.elements[i] 
    
    // Get the field's name 
    form_id = form_field.id 
    
    // Is it a "product" field? 
    if (form_id.substring(0,10) == "Bestelling") { 
    
    // If so, extract the price from the name 
    item_price = parseFloat(form_id.substring(form_id.lastIndexOf("_") + 1)) 
    
    // Get the quantity 
    item_quantity = parseInt(form_field.value) 
    
    // Update the order total 
    if (item_quantity >= 0) { 
    order_total += item_quantity * item_price 
    } 
    } 
    } 
    
    // Display the total rounded to two decimal places 
    document.getElementById("Bestelling_totaal").firstChild.data = " " + round_decimals(order_total, 2)
    } 
    
    function round_decimals(original_number, decimals) { 
    var result1 = original_number * Math.pow(10, decimals) 
    var result2 = Math.round(result1) 
    var result3 = result2 / Math.pow(10, decimals) 
    return pad_with_zeros(result3, decimals) 
    } 
    
    function pad_with_zeros(rounded_value, decimal_places) { 
    
    // Convert the number to a string 
    var value_string = rounded_value.toString() 
    
    // Locate the decimal point 
    var decimal_location = value_string.indexOf(".") 
    
    // Is there a decimal point? 
    if (decimal_location == -1) { 
    
    // If no, then all decimal places will be padded with 0s 
    decimal_part_length = 0 
    
    // If decimal_places is greater than zero, tack on a decimal point 
    value_string += decimal_places > 0 ? "." : "" 
    } 
    else { 
    
    // If yes, then only the extra decimal places will be padded with 0s 
    decimal_part_length = value_string.length - decimal_location - 1 
    } 
    
    // Calculate the number of decimal places that need to be padded with 0s 
    var pad_total = decimal_places - decimal_part_length 
    
    if (pad_total > 0) { 
    
    // Pad the string with 0s 
    for (var counter = 1; counter <= pad_total; counter++) 
    value_string += "0" 
    } 
    return value_string 
    } 
    
    //--> 
    </script> 
    
    </SCRIPT> 
    
    <script type="text/javascript"> 
    function exchange(id){ 
    var ie=document.all&&!window.opera? document.all : 0 
    var frmObj=ie? ie[id] : document.getElementById(id) 
    var toObj=ie? ie[id+'b'] : document.getElementById(id+'b') 
    toObj.style.width=frmObj.offsetWidth+7+'px' 
    frmObj.style.display='none'; 
    toObj.style.display='inline'; 
    toObj.value=frmObj.innerHTML 
    } 
    </script> 
    <!--[if lt IE 10]> 
    <script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
    </head> 
    
    <body id="public"> 
    
    <div id="container" class="ltr"> 
    
    <h1 id="logo"> 
    <a></a> 
    </h1> 
    
    <form id="form6" name="form6" class="wufoo topLabel page"> 
    
    <header id="header" class="info"> 
    <h2>Bestel nu:</h2> 
    <div><br /> 
    <span style="font-size: large;"><b>Pitta's / Pasta's / Schotels / Salades / Snacks / Pizza's</b></span><br /> 
    <br /> 
    
    </header> 
    
    <ul> 
    
    <li id="foli1846" class="likert notranslate 
    col2 
    hideNumbers 
    "> 
    <table cellspacing="0"> 
    <caption id="title1846"> 
    </caption> 
    <thead> 
    <tr> 
    <th>&nbsp;</th> 
    <td >Aantal:</td> 
    </tr> 
    </thead> 
    <tbody> 
    
    
    <tr bgcolor="#d9254c" class="statement1869"> 
    <th><span style="font-size: x-large; color: #FFFFFF;"><b>Desserts:</b></span></th> 
    <td title="Aantal:">&nbsp;</td> 
    </tr> 
    <tr class="alt statement1855"> 
    <th><label for="Field1855">Chocopudding ( 2.50)</label></th> 
    <td title="Aantal:"> 
    <input id="Bestelling_2.50" name="Field1855" type="checkmark" tabindex="146" maxlength="3" autocomplete="off" onKeyPress="return numbersonly(this, event)" onkeyup="CalculateTotal(this.form)"/></td> 
    </tr> 
    <tr class="statement1856"> 
    <th><label for="Field1856">Tiramisu ( 2.50)</label></th> 
    <td title="Aantal:"> 
    <input id="Bestelling_2.50" name="Field1856" type="checkmark" tabindex="148" maxlength="3" autocomplete="off" onKeyPress="return numbersonly(this, event)" onkeyup="CalculateTotal(this.form)"/></td> 
    </tr> 
    <tr class="alt statement1857"> 
    <th><label for="Field1857">Vanillepudding ( 2.50)</label></th> 
    <td title="Aantal:"> 
    <input id="Bestelling_2.50" name="Field1857" type="checkmark" tabindex="150" maxlength="3" autocomplete="off" onKeyPress="return numbersonly(this, event)" onkeyup="CalculateTotal(this.form)"/></td> 
    </tr> 
    <tr bgcolor="#093" class="statement1869"> 
    <th><span style="font-size: x-large; color: #FFFFFF; text-align: right;"><b>Totaal:</b></span></th> 
    <td title="Aantal:"><span id="Bestelling_totaal" OnMouseOver="exchange(this.id)" style="font-size: x-large; color: #FFFFFF; font-weight: bold;">0</span></td> 
    
    </tr> 
    </tbody> 
    </table> 
    </li> 
    
    <li id="foli2061" 
    class="notranslate "><label class="desc" id="title2061" for="Field2061"> 
    Totaal bedrag: 
    </label> 
    
    <input id="Bestelling_totaalb" name="Field2061" type="text" readonly/> 
    </li> 
    
    <li id="foli1947" class="notranslate notStacked "> 
    <fieldset> 
    <![if !IE | (gte IE 8)]> 
    <legend id="title1947" class="desc"> 
    Ik betaal gepast: 
    <span id="req_1947" class="req">*</span> 
    </legend> 
    <![endif]> 
    <!--[if lt IE 8]> 
    <label id="title1947" class="desc"> 
    Ik betaal gepast: 
    <span id="req_1947" class="req">*</span> 
    </label> 
    <![endif]--> 
    <div> 
    <span> 
    <input id="Field1947" name="Field1947" type="checkbox" class="field checkbox" value="Ja" tabindex="151" /> 
    <label class="choice" for="Field1947">Ja</label> 
    </span> 
    <span> 
    <input id="Field1948" name="Field1948" type="checkbox" class="field checkbox" value="Nee" tabindex="152" /> 
    <label class="choice" for="Field1948">Nee</label> 
    </span> 
    </div> 
    </fieldset> 
    <p class="instruct" id="instruct1947"><small>Dit is om te weten of we wisselgeld mee moeten nemen</small></p> 
    </li><li id="foli2054" 
    class="notranslate "><label class="desc" id="title2054" for="Field2054"> 
    Opmerkingen: 
    </label> 
    
    <div> 
    <textarea id="Field2054" 
    name="Field2054" 
    class="field textarea medium" 
    spellcheck="true" 
    rows="10" cols="50" 
    tabindex="153" 
    onkeyup="" 
    autocomplete="off" 
    style="text-transform:uppercase;" on keyup="javascript:this.value=this.value.toUpperCase();" ></textarea> 
    
    </div> 
    </li> 
    <li id="foli2056" class="notranslate "> 
    <label class="desc" id="title2056" for="Field2056"> 
    Naam: 
    <span id="req_2056" class="req">*</span> 
    </label> 
    <span> 
    <input id="Field2056" name="Field2056" type="text" class="field text fn" value="" size="8" tabindex="154" required /> 
    <label for="Field2056">Voornaam</label> 
    </span> 
    <span> 
    <input id="Field2057" name="Field2057" type="text" class="field text ln" value="" size="14" tabindex="155" required /> 
    <label for="Field2057">Achternaam</label> 
    </span> 
    </li> 
    <li id="foli2058" class="notranslate "> 
    <label class="desc" id="title2058" for="Field2058"> 
    E-mail: 
    <span id="req_2058" class="req">*</span> 
    </label> 
    <div> 
    <input id="Field2058" name="Field2058" type="email" spellcheck="false" class="field text medium" value="" maxlength="255" tabindex="156" required /> 
    </div> 
    </li> 
    <li id="foli2059" class="notranslate "> 
    <label class="desc" id="title2059" for="Field2059"> 
    GSM-nummer: 
    <span id="req_2059" class="req">*</span> 
    </label> 
    <div> 
    <input id="Field2059" class="field text medium" name="Field2059" tabindex="157" required 
    type="tel" maxlength="255" value="04" /> 
    </div> 
    </li><li id="foli2047" class="complex notranslate "> 
    <label class="desc" id="title2047" for="Field2047"> 
    Adres: 
    <span class="req">*</span></label> 
    <div> 
    <span class="full addr1"> 
    <input id="Field2047" name="Field2047" type="text" class="field text addr" value="" tabindex="158" style="text-transform:uppercase;" on keyup="javascript:this.value=this.value.toUpperCase();" /> 
    <label for="Field2047">Straat &amp; nummer</label> 
    </span> 
    <span class="left zip"> 
    <input id="Field2051" name="Field2051" type="text" class="field text addr" value="" maxlength="4" tabindex="159" /> 
    <label for="Field2051">Postcode</label> 
    </span> 
    <span class="left city"> 
    <input id="Field2049" name="Field2049" type="text" class="field text addr" value="" tabindex="160" style="text-transform:uppercase;" on keyup="javascript:this.value=this.value.toUpperCase();" /> 
    <label for="Field2049">Plaats</label> 
    </span> 
    </div> 
    </li> 
    
    <li class="buttons "> 
    <div> 
    <P span id="Bestelling_totaal" style="text-align:center;" OnMouseOver="exchange(this.id)" > 
    <input id="Bestelling_totaal" name="saveForm" class="btTxt submit" 
    type="submit" value="Verstuur" tabindex="161" 
    /></P> 
    </li> 
    
    
    
    
    </ul> 
    </form> 
    
    </div> 
    </body> 
    </html>

  • #2
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    You have a number of errors in your code (validate) including mismatched tags and duplicate ids. You should fix these first.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #3
    New to the CF scene
    Join Date
    Aug 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by AndrewGSW View Post
    You have a number of errors in your code (validate) including mismatched tags and duplicate ids. You should fix these first.
    first i want to now how to make it work correctly before fixing the errors


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •