Page 2 of 4 FirstFirst 1234 LastLast
Results 11 to 20 of 31

Thread: Order Form w/current options live total

  1. #11
    Join Date
    Jul 2012
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    Really? Wow!

    I don't remember if I mentioned this so I'll run through so you'll see the problems that might make it tough.

    Everything on the form (and the base price) is based on the length, two drop down lists, feet and inches. Mostly radio buttons that are just choice selections but don't affect the price. I can have a hidden value of the inches in decimals, so for instance, a 6'1" would be 6.0833 . It would need to add the two drop down lists like I mentioned multiplied by a base price factor, then the two or three radio buttons that do effect the price and I have broken down to $ per board foot, and maybe another one that may add a fixed amount if selected to that total.

    This just seems ridiculously complicated even to me, that is why I am kind of leery of finding a working solution.

    If you or someone can get close, I might be able to adapt it. And you would have my never ending thanks!

  2. #12
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    47
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    i have finished writing a sample, and it works. hopefully it wont be too complicated for you. Forgive me for size and price estimates, as i have no idea about surfboards
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
        <title>Surfboard Form</title>
        <script type="text/javascript">
    
     
     //Set up an associative array
     var surf_prices = new Array();
     surf_prices["good"]=100;
     surf_prices["pretty"]=200;
     surf_prices["very"]=300;
     surf_prices["epic"]=1000;
      
     //Set up an associative array 
     //We use this this array when the user selects a size from the form
     var size_prices= new Array();
     size_prices["None"]=0;
     size_prices["5 ft"]=100;
     size_prices["6 ft"]=150;
     size_prices["7 ft"]=200;
     size_prices["8 ft"]=250;
     size_prices["9 ft"]=300;
      
          
          
    // getsurfboardPrice() finds the price based on the size of the Surfboard.
    function getsurfboardPrice()
    {  
        var surfboardPrice=0;
        //Get a reference to the form id="Surfboardform"
        var theForm = document.forms["surfboardForm"];
        //Get a reference to the Surfboard the user Chooses name=selectedsurf":
        var selectedsurf = theForm.elements["selectedsurf"];
        //Here since there are 4 radio buttons selectedsurf.length = 4
        //We loop through each radio buttons
        for(var i = 0; i < selectedsurf.length; i++)
        {
            //if the radio button is checked
            if(selectedsurf[i].checked)
            {
                //set surfboardPrice to value of elected radio button
                // using the surf_prices array
                //We get the selected Items value
                surfboardPrice = surf_prices[selectedsurf[i].value];
                //If we get a match then we break out of this loop
                //No reason to continue if we get a match
                break;
            }
        }
        //return surfboardPrice
        return surfboardPrice;
    }
     
    //This function finds the size price based on the 
    //drop down selection
    function getSurfSize()
    {
        var surfSizePrice=0;
        //Get a reference to the form id="Surfboardform"
        var theForm = document.forms["surfboardForm"];
        //Get a reference to the select id="size"
         var selectedsize = theForm.elements["size"];
          
        //set Surfboardsize Price equal to value user chose
        surfSizePrice = size_prices[selectedsize.value];
     
        // return surfSizePrice
        return surfSizePrice;
    }
     
    //footstrapPrices() finds foot strap price based on a check box selection
    function footstrapPrices()
    {
        var footstrapPrice=0;
        //Get a reference to the form id="Surfboardform"
        var theForm = document.forms["surfboardForm"];
        //Get a reference to the checkbox id="includeFootStrap"
        var includeFootStrap = theForm.elements["includeFootStrap"];
     
        //If they checked the box set footstrapPrice to 5
        if(includeFootStrap.checked==true)
        {
            footstrapPrice=50;
        }
        //return footstrapPrice
        return footstrapPrice;
    }
     
    function insciptionPrice()
    {
        //This local variable will be used to decide whether or not to charge for the inscription
        //If the user checked the box this value will be 20
        //otherwise it will remain at 0
        var inscriptionPrice=0;
        //Get a refernce to the form id="Surfboardform"
        var theForm = document.forms["surfboardForm"];
        //Get a reference to the checkbox id="includeinscription"
        var includeInscription = theForm.elements["includeinscription"];
        //If they checked the box set inscriptionPrice to 20
        if(includeInscription.checked==true){
            inscriptionPrice=20;
        }
        //return inscription price
        return inscriptionPrice;
    }
             
    function calculateTotal()
    {
        //total price by calling functions
        var SurfboardPrice = getsurfboardPrice() + getSurfSize() + footstrapPrices() + insciptionPrice();
         
        //display result
        var divobj = document.getElementById('totalPrice');
        divobj.style.display='block';
        divobj.innerHTML = "Total Price For the Surfboard $"+SurfboardPrice;
     
    }
     
    function hideTotal()
    {
        var divobj = document.getElementById('totalPrice');
        divobj.style.display='none';
    }
    
    </script>
    </head>
    <body onload='hideTotal()'>
        <div id="wrap">
            <form action="" id="surfboardForm" onsubmit="return false;">
            <div>
                <div class="cont_order">
                   <fieldset>
                    <legend>Get a Surfboard!</legend>
                    <label >Type of Surfboard:</label><br />
                    <label class='radiolabel'><input type="radio"  name="selectedsurf" value="good" onclick="calculateTotal()" />good surfboard ($100)</label><br/>
                    <label class='radiolabel'><input type="radio"  name="selectedsurf" value="pretty" onclick="calculateTotal()" />pretty good surfboard($200)</label><br/>
                    <label class='radiolabel'><input type="radio"  name="selectedsurf" value="very" onclick="calculateTotal()" />very good surfboard($300)</label><br/>
                    <label class='radiolabel'><input type="radio"  name="selectedsurf" value="epic" onclick="calculateTotal()" />epic surfboard ($1000)</label><br/>
                    <br/>
                    <label>size</label>
             
                    <select id="size" name='size' onchange="calculateTotal()">
                    <option value="None">Select size</option>
                    <option value="5 ft">5 ft($100)</option>
                    <option value="6 ft">6 ft($150)</option>
                    <option value="7 ft">7 ft($200)</option>
                    <option value="8 ft">8 ft($250)</option>
                    <option value="9 ft">9 ft($300)</option>
                   </select>
                    <br/>
                    <p>
                    <label for='includeFootStrap' class="inlinelabel">Include epic Footstrap($50)</label>
                   <input type="checkbox" id="includeFootStrap" name='includeFootStrap' onclick="calculateTotal()" />
                   </p>
                   
                    <p>
                    <label class="inlinelabel" for='includeinscription'>Include Inscription($20)</label>
                    <input type="checkbox" id="includeinscription" name="includeinscription" onclick="calculateTotal()" />
                    <input type="text"  id="theinscription" name="theinscription" value="Enter Inscription"  />
                    </p>
                    <div id="totalPrice"></div>
                    
                    </fieldset>
                </div>
                
                <input type='submit' id='submit' value='Submit' onclick="calculateTotal()" />
            </div>  
           </form>
    </div><!--End of wrap-->
    
    </body>
    </html>
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

  3. The Following User Says Thank You to bernie1227 For This Useful Post:

    williamsun (07-31-2012)

  4. #13
    Join Date
    Jul 2012
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default



    Thank you thank you thank you ! ! !

    I need to get back out and get a skil saw in my hands and finish the new factory for now, but I'll take a look and try some stuff with that this evening.

    I'm sure I'll have many more questions.

    Thanks again man!

  5. #14
    Join Date
    Jul 2012
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    Is it adding 'surf_prices' and 'size_prices' to get the variable 'selectedsurf' and attaching that value to the new variable 'surfboardPrice' ?
    With 'selectedsurf.length' being the number of radio buttons of surfboard types?
    Last edited by williamsun; 08-01-2012 at 07:18 PM.

  6. #15
    Join Date
    Jul 2012
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    Maybe it's better if I show what I'm trying to do with fictional prices.

    //Set up an associative array
    var ft_price = new Array();
    ft_price["05ft"]=400.00;
    ft_price["06ft"]=400.00;
    ft_price["07ft"]=450.00;
    ft_price["08ft"]=500.00;
    ft_price["09ft"]=550.00;
    ft_price["10ft"]=600.00;

    //Set up an associative array
    //We use this this array when the user selects a size from the form
    var in_price= new Array();
    in_price["None"]=0;
    in_price["00in"]=00.00;
    in_price["01in"]=04.17;
    in_price["02in"]=08.34;
    in_price["03in"]=12.50;
    in_price["04in"]=16.67;
    in_price["05in"]=16.67;
    in_price["06in"]=25.00;
    in_price["07in"]=29.17;
    in_price["08in"]=33.34;
    in_price["09in"]=37.50;
    in_price["10in"]=41.67;
    in_price["11in"]=45.84;

    ft_price + in_price = baseprice (the total of the two drop down lists, feet and inches. This is more important than the 10 radio buttons selecting 'boardtype'.)

    ...and then use the baseprice to add to or subtract from for 'surfboardprice' or 'totalprice'. Something like that.

    I don't want to be headed in the wrong direction and mess it up even worse, and waste even more of your time.

  7. #16
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    47
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    So what is happening here, is that the arrays are being referenced in the functions; getsurfboardPrice and getSizePrice respectively, then those two functions are added together along With the foot strap and the inscription to get the total price.

    Just as a suggestion, when you want to replace array names or variable names, I suggest you actually do a search and replace, because this means that you win't have to go through and change them individually and there is no chance of you missing any of them.
    Last edited by bernie1227; 08-01-2012 at 09:04 PM.
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

  8. #17
    Join Date
    Jul 2012
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    I appreciate your help explaining it to me. - I am using search & replace.

    So if a customer chose a special cloth in the middle of the form that added $7 per board foot plus X-cents per extra inch, and keyed off of the feet and inches already selected, how would I do that? Or would it overly complicate it for me.

  9. #18
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    47
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    Sorry, I don't really understand, so do want it to be a dropdown box or radio buttons to select cloth for extra price?
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

  10. #19
    Join Date
    Jul 2012
    Posts
    44
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    Yes you did. The cloth question is new. I just thought I'd ask while I was messing with this deal.

    I could copy and modify the two arrays, functions, variables, & price values, but then that would mean 2 more drop down lists for feet and inches of cloth. That would be too clumsy and open to inconsistent settings with the board feet and inches already selected. I would rather use text specifying the extra cost and the customer and I calculate it manually.

    What I was wondering is if there is a way to use the board feet and inches already selected and somehow redefine the output value to the different price value, then add that along with the others already being added for the totalprice. It would be a radio button for the special cloth. Either yes or no (the default).

    Is this possible?

  11. #20
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    47
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    Oh ok, that makes sense now, thanks for clarifying, what you'd want to do, is create a new function to check whether the user wanted the special cloth, in which you'd check to see if the user checked a radio button, like I did elsewhere in the script, and then in the function calculateTotal you would add the special cloth function to the final total, in which all the other functions are being added together.
    "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program." - Linus Torvalds
    Anime Views Forums
    Bernie

Bookmarks

Posting Permissions

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