www.webdeveloper.com
Results 1 to 2 of 2

Thread: NOOB questions about variables to create pricing calculator.

  1. #1
    Join Date
    Dec 2012
    Posts
    1

    NOOB questions about variables to create pricing calculator.

    Hey guys,

    I am working on a pricing calculator for my shirt business and have gotten over my head. Here is what I have so far: www.shirtagency.com Ultimately this calculator should adjust for tiered pricing, file upload, have a submit/buy button, and use pictures instead of drop downs to select an item. Please help me out with any suggestions. I am especially anxious to implement the tiered pricing so it isn't stuck at 24 pcs like it currently is.

    Below is my calculator code thus far....

    <html>
    <head>
    <script type="text/javascript">
    var divsarray=new Array('div0','div1','div2');

    function showDivs(divs)
    {
    //get number of div to show
    var num = parseInt(divs);

    //show the div
    document.getElementById(divsarray[num]).style.display='block';

    //add one for next div
    document.getElementById('lastdiv').value=(num+1);

    //set quantity field
    var quantity = 'quantity' + num;

    //set price field
    var price = 'price' + num;

    //set total field
    var total = 'total' + num;

    //put values in inputs fields of div displayed above
    document.getElementById(quantity).value= document.getElementById('quantity100').value;
    document.getElementById(price).value = document.getElementById('price100').value;
    document.getElementById(total).value=document.getElementById('total100').value;

    //Clear the original input fields
    document.getElementById('quantity100').value = "";
    document.getElementById('mySelect').options[0].selected=true;
    document.getElementById('price100').value = "";
    document.getElementById('total100').value = "";
    document.getElementById('grand').style.display='block';

    //calculate the grand total
    var grand=0;
    for(var j=0;j<divsarray.length;j++)
    {
    var mytotal = "total" + j;
    grand = eval(document.getElementById(mytotal).value) + grand;
    document.getElementById('grandtotal').value=grand;
    }
    }

    function updateForm(what)
    {
    selected = what.mySelect.selectedIndex;
    values = what.mySelect.options[selected].value;
    document.getElementById('price100').value = values;
    document.getElementById('total100').value = eval(values * document.getElementById('quantity100').value).toFixed(2);
    }
    </script>
    <style type="text/css">
    #divsform p #quantity100 {
    color: #C0C0C0;
    }
    </style>
    </head>
    <body>
    <form name="divsform" id="divsform">
    <div id="grand" style="display:none">
    Order Total:<br>
    <input type="text" value="0" id="grandtotal" name="grandtotal">
    </div>
    <p>
    QUANTITY:
    <input type="text" name="quantity100" id="quantity100">
    ITEM:
    <select name="mySelect" onChange="updateForm(this.form)">
    <option value="">
    <option value="4.72">Budget Tshirt
    <option value="6.72">1 Color
    <option value="7.02">2 Color
    <option value="7.32">3 Color
    <option value="7.62">4 Color
    <option value="7">Ringspun Anvil
    <option value="9">1 Color
    <option value="9.30">2 Color
    <option value="9.60">3 Color
    <option value="9.90">4 Color
    <option value="9.54">American Apparel
    <option value="11.54">1 Color
    <option value="11.84">2 Color
    <option value="12.14">3 Color
    <option value="12.44">4 Color
    <option value="13">Embroidered Anvil Polo
    <option value="18.34">Embroidered Featherlite Polo
    </select>
    <p>PRICE PER UNIT:
    <input type="text" name="price100" id="price100">
    TOTAL:
    <input type="text" name="total100" id="total100" onClick="divsform.total100.value = (divsform.quantity100.value - 0) * (divsform.price100.value - 0))">
    </form>
    </body>
    </html>

  2. #2
    Join Date
    Dec 2012
    Posts
    54
    A couple suggestions.

    1. Use Code Tags
    2. Use Identation
    3. Describe the actual error you are encoutering

    It will help others trying to assist you to see the problem more clearly. The longer you stare at code the more you'll understand. As far as describing the error it allows someone to address the exact issue you are having rather than just overhauling all your code.

    I copy and pasted your code and viewed it in FF.

    Your code only had one error:

    Code:
    [16:07:18.631] The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol. @ file://///home/lesshardtofind/Websites/Help/home.html
    Everything calculated corectly based on the base price you have and the quantity I put in the box.

    I'm having trouble locating what your actual question is.

    The only suggestion I would have about the functionality itself is have it calculate once the user inputs quantity also and maybe display the results in a different way as the user really won't need the ability to edit the price per unit or the total price. (this could be come annoying to the user if they accidently click the total box and then they can't get it to recalculate no realizing they have to pick the product again to get it to recalculate)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

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
  •  
HTML5 Development Center



Recent Articles