Community Forums 

Main Content

form with lots oif text boxes & drop downs. help needed

    Apr 15 2013 18:33:45

    #1

    PetSmoke

    Join date : 2013-02-17      Posts : 225

    Here is a script I been using for a client of mine. you can alter it for your needs. If you need me to customize it for you just post back and I will.

    <div id="malsform">

    <fieldset> <legend>Infant White</legend>
    <form name="myform" action="http://ww7.aitsafe.com/cf/addmulti.cfm"; method="post">
    <input type="hidden" name="units" value="">
    <input type="hidden" name="userid" value="xxxxxxxx">
    <input type="hidden" name="return" value="">

    <p>Name, Initials or Monogram: <input type="text" name="product1[]" size="14" value="">
    <br>
    Letters/Numbers <input type="text" name="product1[]" size="4" value="">
    <br>
    Size: <select size="1" name="productpr1">
    <option value="">no</option>
    <option value="Infant Layette gown, Preppy Anchor Monogram, Size 0-3 months, :23.99:300:">Layette gown 0-3 months</option>
    <option value="Infant Onesie, Preppy Anchor Monogram, Size 0-3 months, :23.99:300:">Onesie 0-3 months</option>
    <option value="Infant Onesie, Preppy Anchor Monogram, Size 3-6 months, :23.99:300:">Onesie 3-6 months</option>
    <option value="Infant Onesie, Preppy Anchor Monogram, Size 6-12 months, :23.99:300:">Onesie 6-12 months</option>
    <option value="Infant Onesie, Preppy Anchor Monogram, Size 12-18 months, :23.99:300:">Onesie 12-18 months</option>
    </select>
    <br>
    Add Long Sleeve:
    <input type="radio" checked="" name="productpr2" value=""> no
    <input type="radio" name="productpr2" value="Yes add long sleeves, :2:"> yes (add $2.00)
    <br>
    Quantity: <input <input="" size="4" type="text" name="qty1" value="0" onkeyup="document.myform.qty2.value=document.myform.qty1.value">
    <input type="hidden" name="qty2" value=""></p>

    Additional Comments (e.g color changes): <input type="text" name="product1[]" size="40" value="">
    </form></fieldset>

    <fieldset> <legend>Boys White</legend>
    <p>Name, Initials or Monogram: <input type="text" name="product3[]" size="14" value="">
    <br>
    Letters/Numbers <input type="text" name="product3[]" size="4" value="">
    <br>
    Size: <select size="1" name="productpr3">
    <option value="">no</option>
    <option value="Boys Short Sleeve, Preppy Anchor Monogram, Size 12 month, :23.99:300:">Short Sleeve 12 month</option>
    <option value="Boys Short Sleeve, Preppy Anchor Monogram, Size 18 month, :23.99:300:">Short Sleeve 18 month</option>
    <option value="Boys Short Sleeve, Preppy Anchor Monogram, Size 2, :23.99, :300:">Short Sleeve 2</option>
    <option value="Boys Short Sleeve, Preppy Anchor Monogram, Size 4, :23.99, :300:">Short Sleeve 4</option>
    <option value="Boys Short Sleeve, Preppy Anchor Monogram, Size 6, :23.99, :300:">Short Sleeve 6</option>
    <option value="Boys Short Sleeve, Preppy Anchor Monogram, Size 8, :23.99, :300:">Short Sleeve 8</option>
    </select>
    <br>
    Add Long Sleeve:
    <input type="radio" checked="" name="productpr4" value=""> no
    <input type="radio" name="productpr4" value="Yes add long sleeves, :2:"> yes (add $2.00)
    <br>
    Quantity: <input size="4" type="text" name="qty3" value="0" onkeyup="document.myform.qty4.value=document.myform.qty3.value">
    <input type="hidden" name="qty4" value=""></p>

    Additional Comments (e.g color changes): <input type="text" name="product3[]" size="40" value="">
    </fieldset>

    <fieldset> <legend>Girls White</legend>
    <p>Name, Initials or Monogram: <input type="text" name="product5[]" size="14" value="">
    <br>
    Letters/Numbers <input type="text" name="product5[]" size="4" value="">
    <br>
    Size: <select size="1" name="productpr5">
    <option value="">no</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 12 month, :23.99:300:">Short Sleeve 12 month</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 18 month:23.99:300:">Short Sleeve 18 month</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 2, :23.99:300:">Short Sleeve 2</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 4, :23.99:300:">Short Sleeve 4</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 6, :23.99:300:">Short Sleeve 6</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 10, :25.99:300:">Short Sleeve 10 +$2</option>
    <option value="Girls Short Sleeve, Preppy Anchor Monogram, Size 12, :25.99:300:">Short Sleeve 12 +$2</option>
    </select>
    <br>
    Add Long Sleeve:
    <input type="radio" checked="" name="productpr6" value=""> no
    <input type="radio" name="productpr6" value="Yes add long sleeves, :2:"> yes (add $2.00)
    <br>
    Quantity: <input size="4" type="text" name="qty5" value="0" onkeyup="document.myform.qty6.value=document.myform.qty5.value">
    <input type="hidden" name="qty6" value=""></p>

    Additional Comments (e.g color changes): <input type="text" name="product5[]" size="40" value="">
    </fieldset>
    <br>
    <input class="rounded" type="submit" value="Add to cart"><p></p>

    </div>

    This world can be a little Flippy!
    Freelance web designer: http://www.gdfwonline.com
    My tips and tools for making a website: http://hidden-opportunities.weebly.com

    GT's forms and examples: www.malsforms.com
    Helpful java scripts: www.gemasana.com/mals
    Alan's Shipping help documents: www.stoner.org.uk/mals
    Add-ons for your shopping cart: https://www.mals-e.com/addons.php
    Adding a nav menu: https://www.mals-e.com/viewtopic.php?id=24368&mid=24368&fid=2
    Image zoom tool: http://www.magictoolbox.com/magiczoomplus/examples/?ac=16NGYX7
    Stamps.com: https://stamps.custhelp.com/app/answers/detail/a_id/17/~/importing-addresses
    Change the cart text: https://www.mals-e.com/viewtopic.php?id=10585&mid=10585&fid=2

    For 25% off any Host Gator web host plan enter: 66Coupon25
    For $9.94 off any Host Gator web host plan enter: 6Coupon994
    For $10 off any Weebly premium plan visit: http://www.weebly.com/link/4B1Tl5
    For more promos visit: http://hidden-opportunities.weebly.com/promo-codes.html




    Apr 15 2013 18:48:10

    #2

    Claire

    Join date : 2008-11-08      Posts : 90

    Alan - looks like your solution will work! nice :) I edited 1 option so far using your codes. I will post back with complete working form in case anyone else needs to use. thank you!


    Alan said You can set the qty to 0 and change it to 1 if the product is selected. Using part of your form, if I don't select the product, nothing goes to the cart, even if I enter text.

    If I do select the product then because the non-chargeable items are not new products, they go to the cart as text (if any) and commas. I described earlier how to remove commas if wished.

    <form action="http://ww1.aitsafe.com/cf/addmulti.cfm"; method="post" id="qtys" name="qtys"><input name="userid" value="3846922" type="hidden">
    <p>
    Complete options below for each line of embroidery you are ordering<br>
    <input name="qty5" value="0" type="hidden">
    Select Font Style Line #1: <select name="productpr5" font-line1="" onChange='document.qtys.qty5.value="1"' >

    <option selected="selected"></option>
    <option value="Font Line 1-Block-:00.00:0">Block</option>
    <option value="Font Line 1-Script-:00.00:0">Script</option>
    <option value="Font Line 1-Full-Block-:00.00:0">Full Block</option>
    <option value="Font Line 1-Full Block Outlined-:00.00:0">Full Block Outlined</option>
    <option value="Font Line 1-2-Tone-Full Block-:5.00:0">2 Tone Full Block</option>
    </select>

    <br>Text for Line 1: <input name="product5[]" size="20" type="text">
    <br>Thread color Line 1:<input name="product5[]" size="20" type="text"><br>
    *if you chose 2-Tone font for line 1, The field above is for the inside color, the field below is for the outline color.<br>
    Line1-2nd color/outline for 2-tone Full Block Only:<input name="product5[]" size="20" type="text">
    <P>
    <input name="submit" type="submit" value="Add to Cart"></form>

    ----
    Claire Walters Design Studios




    Apr 15 2013 20:12:22

    #3

    Claire

    Join date : 2008-11-08      Posts : 90

    The site is still under development now. But here's a link to the page this code is going into. click the tab titled 'Order custom belt w/ Embroidery" as you can see it is quite detailed when building a weightbelt with embroidery. Even tho there's technically only 2 options. Embroidery on back or on tongue. It turns into many choices & input needed ha! :D

    all these options could probably been done a few diff ways - possibly forcing user to enter text if they forget ?. but I'm not getting into that. for now this layout seems to work best for my client.

    hope this will help others.

    http://geekhostess.com/cardillo/Cardilloweightbelts/product/310dl-weightbelt/

    Thx to all who replied.

    ----
    Claire Walters Design Studios




       «      1   |   2