Community Forums 

Main Content

color + multiple quantity boxes for sizes...

    Aug 06 2010 20:20:20

    #1

    formulawerks

    Join date : 2010-03-12      Posts : 18

    hey all. quick question...i use html forms for everything, and i'm trying to figure out how i'd offer a drop-down for color + multiple quantity drop-downs or text boxes.

    basically, the customer chooses a color, then they either choose a qty or input a qty for each of the S M L XL XXL, etc. (therefore, when they add to cart, is has a quantity chosen for each and all of the sizes.)

    i'm trying to avoid having them choose a size + a qty and add to cart, then choose another size + qty and add to cart, etc.

    i've got all the basics down as well as multiple drop-downs, just not sure how to do quantities for multiple options like that.

    hopefully that makes sense. any insight would be appreciated. thanks!



    Aug 06 2010 20:54:50

    #2

    formulawerks

    Join date : 2010-03-12      Posts : 18

    i actually put a sample image up of what i'm trying to do. just did it in photoshop real quick. those boxes are input boxes (they could be drop downs as well, although i think the arrows would take up too much space.)

    sample: http://formulasupply.com/images/cartsample.jpg

    thanks in advance for any insight.



    Aug 06 2010 23:04:12

    #3

    Gil Sery

    Join date : 2010-04-27      Posts : 141

    formulawerks said i actually put a sample image up of what i'm trying to do. just did it in photoshop real quick. those boxes are input boxes (they could be drop downs as well, although i think the arrows would take up too much space.)

    sample: http://formulasupply.com/images/cartsample.jpg

    thanks in advance for any insight.


    Thanks for the pic. It helped a lot. This is basic HTML. To read more about it, visit http://www.w3schools.com/html/html_forms.asp.

    As for how to do it, probably best to do these as forms too.

    For the Color dropdown, you'd use:

    <select name="color">
    <option value="red" selected>Red</option>
    <option value ="blue">Blue</option>
    <option value="green">Green</option>
    </select>

    I think you may need to use the "productpr[]" field for these, but someone else can probably help you more in this area.

    The "selected" part is your default selection for the list.

    For the textboxes, do this:

    <input type="text" size="1" maxlength="3" name="small_qty"> & nbsp;& nbsp;
    <input type="text" size="1" maxlength="3" name="medium_qty"> & nbsp;& nbsp;
    <input type="text" size="1" maxlength="3" name=large_qty"> & nbsp;& nbsp;
    <input type="text" size="1" maxlength="3" name="xl_qty"> & nbsp;& nbsp;
    <input type="text" size="1" maxlength="3" name="xxl_qty"> & nbsp;& nbsp;
    <input type="text" size="1" maxlength="3" name="3xl_qty"> & nbsp;& nbsp;
    <input type="text" size="1" maxlength="3" name="4xl_qty"> & nbsp;& nbsp;

    Let's break this down, so you understand how to edit it.

    type="text" means create a text box.
    size="1" means create a really small text box.
    maxlength="3" means the most anyone can write in that text box is 3 characters The form won't let you enter anything more. Thus the most anyone can order in that size is 999 (the highest 3-digit number).
    name is the quantity field's name. Not sure how this will translate to the cart, but this is the HTML to do what you have in the pic.
    & nbsp; is HTML code for 1 non-breaking white space. (Please note that there should be no space between the '&' and the 'nbsp;'. I just had to do that in this forum to show you what I mean.)

    By definition, HTML only lets you insert one space between words, so if you want to insert more, you need to use what is called non-breaking (i.e. does not go to the next line) white space. To create what you have in the image, you'll need three spaces, i.e. one touch of the spacebar, followed by 2 occurences of & nbsp;

    Hope this helps, and good luck.



    Aug 07 2010 01:22:42

    #4

    formulawerks

    Join date : 2010-03-12      Posts : 18

    thanks for that. i guess i should have noted that i do know html. not everything, but most things.

    i'm simply not very sure how to change it from an add.cfm product to the proper code for addmulti with the quantity boxes. i started on it but i'm definitely missing some knowledge.

    that said, this is what the code looked like for one product. i took out the size option because it's not being used in the new code.

    basically, i need help figuring out the above - how to recode it properly with mal's for the quantity boxes.

    we scrapped all tables and use divs now, for those that might be confused reading all of these ul's and li's and spans.

    original code (size option deleted):

    -------------------------------------------------------------------------------

    <form action="http://ww4.aitsafe.com/cf/add.cfm"; method="post" onSubmit="return AddToCart(this)">

    <input type="hidden" name="userid" value="XXXX-USERID-XXXX">
    <input type="hidden" name="product[]" value="T-shirt">
    <input type="hidden" name="price" value="25.00">
    <ul>
    <li>
    <span>Color:</span>
    <select name="product[]" class="base"><option value="Color 1">Color 1</option><option value="Color 2">Color 2</option></select>
    </li>
    <li>
    </ul>

    <input type="image" border="0" src="http://DOMAIN.com/images/addtocart.gif"; value="Buy Now!">

    </form>

    -----------------------------------------------------------

    i thought i had the boxes proper before i posted here, but it wasn't working. and i guess i just don't understand how to move from product[] to productpr or to addmulti.

    thanks again gil. hopefully you or someone else can help me understand the full switch - product, quantity, add/addmulti, etc.



    Aug 07 2010 04:56:59

    #5

    GT

    Join date : 2008-09-18      Posts : 3207

    Take a look at my page, if there's nothing there email me from the page.

    Having trouble with a form or need one building?
    Fast turnaround, but I do charge :)

    Mal's Forms / Scripts and the syntax are here.




    Aug 07 2010 15:36:59

    #6

    formulawerks

    Join date : 2010-03-12      Posts : 18

    GT said Take a look at my page, if there's nothing there email me from the page.

    yeah i was looking at your page yesterday (which is always very helpful - i used it when we first started using mal's). i just went through all the items again this morning. tried to figure it out based on code from various other items since i didn't see anything that exactly matched what i need. and i failed. haha.

    i've never really messed with quantity options like this (prices are all the same across the board as well), and i'm still stumped even though i'm 99% sure this is not difficult.

    sending you a message now.