Community Forums 

Main Content

Color dropdown does not appear

    Aug 25 2011 09:58:20

    #1

    anandmahey

    Join date : 2011-08-25      Posts : 11

    Hi Everyone,

    I've been trying the whole day to get this. Its my first time working with forms. I have some html knowledge, but thats all.

    I work for a small fabric company and we're trying to implement a shopping cart. We need the Item (e.g. Velvet) Color (e.g. Red) and Quantity (e.g. 2, preferably with a choice of Meters, Yards or Rolls as the units) to appear on the shopping cart. I managed to get the Item and Quantity (without the units though. please help) to appear on the cart, but not the Color.

    Here's the code, its from Mal's forms:

    <form action="http://ww12.aitsafe.com/cf/add.cfm"; method="post">
    <input type="hidden" name="userid" value="E9120065">
    <input type="hidden" name="nocart">
    <input type="hidden" name="return" value="www.malsforms.com/send-to-cart.html">;


    Color:<select name="product1[]">
    <option selected="Red">Red</option>
    <option value="White">White</option>
    <option value="black">black</option>
    </select>


    Quantity:<input type="text" name="qty" size="2">
    <input type="hidden" name="product" value="Taffeta Velvet">
    <input type="hidden" name="price" value="4.95">



    <input type="submit" name="Submit" value="Add to order" onclick="alert('Order has been added to your cart\n\nThis page will refresh');">
    </form>


    <a href="http://ww12.aitsafe.com/cf/review.cfm?userid=E9120065&amp;return=www.malsforms.com/send-to-cart.html">View your cart/checkout</a>


    Would really appreciate some help in implementing the above.

    Thank you



    Aug 25 2011 11:29:34

    #2

    GT

    Join date : 2008-09-18      Posts : 3239

    As you're using a single product in your form, you can drop the number as in:
    Color:<select name="product1[]">
    to:
    Color:<select name="product[]">

    Also, change this line:
    <input type="hidden" name="product" value="Taffeta Velvet">
    To:
    <input type="hidden" name="product[]" value="Taffeta Velvet">

    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 25 2011 11:44:59

    #3

    anandmahey

    Join date : 2011-08-25      Posts : 11

    omg, you're awesome! Thank you so much GT!



    Aug 26 2011 07:17:15

    #4

    anandmahey

    Join date : 2011-08-25      Posts : 11

    Hi i'm back again.

    The idea is to display multiple products on the same "Order Now" page.

    Since we are a fabric shop, the idea is to have a multiple items, and a drop down menu to select the colors.

    Here's the thing, the customer will need to select a checkbox to select a product, then use the drop down menu to select the colors, and enter quantity in the text box.

    An after the customer has made selections for a few items (or even one item) the customer clicks like a "Add All to cart"

    I have messed up the code trying to figure this out. The thing is, I'd like the item to post to the cart only if the checkbox is selected. How do i do this? Anyone got a sample form? I'm checked Mals Forms, copied and pasted, manipulated the code, but really, not successful at all.

    Please help.



    Aug 26 2011 10:49:38

    #5

    GT

    Join date : 2008-09-18      Posts : 3239

    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 26 2011 16:04:51

    #6

    Debbie Q

    Join date : 2008-09-18      Posts : 4998

    Change your form method to addmulti.cfm. Use productprX and give each item a product number. You don't even need to use a checkbox. One less step for the customer.

    <input type="hidden" name="productpr1" value="Taffeta Velvet, :4.95:1">
    Color:<select name="product1[]">
    <option value="Red">Red</option>
    <option value="White">White</option>
    <option value="black">black</option>
    </select>
    Quantity:<input type="text" name="qty1" size="2">

    Debbie Q

    Mal's Support: www.mals-e.com/support.php
    GT's Forms and examples: www.malsforms.com
    Helpful java scripts: www.gemasana.com/mals
    Shipping help documents: www.stoner.org.uk/mals

    My Create-A-Book Publishing - mycreateabook.com
    Personalized Books, Music CDs and Gifts for all ages and occasions.

    Please help me out and share my site on your networks.




    Aug 27 2011 07:12:49

    #7

    anandmahey

    Join date : 2011-08-25      Posts : 11

    Thank you Debbie and GT. Both are great suggestions.

    I'll be using Debbie's idea, coz it reduces the work for a customer when they want to place a order.

    I'd like to add a clear selection button, which clears the cart as well, to each item.

    Would also like to add a clear all button which clears the cart as well. The current "clear selection" button does not update the "display cart contents on the same page" (http://www.malsforms.com/display-cart.html) and does not clear the cart.

    appreciate the help.

    This is the code so far:

    <html>

    <head>

    <script type="text/javascript">
    function upDate(){
    qty="0"; sub="0.00";
    querystring=parent.document.URL.substring(document.URL.indexOf('?')+1);
    if (querystring.charAt(0)!="q"){querystring="";}
    if (querystring){
    today=new Date();
    millisecs_in_half_hour=1800000;
    expireDate = new Date(today.getTime() + millisecs_in_half_hour);
    document.cookie=querystring+"&exp="+expireDate+";path=/;expires="+expireDate.toGMTString();
    }else{
    if (document.cookie !=""){
    thisCookie=document.cookie.split("; ");
    for (i=0; i<thisCookie.length; i++) {
    if (thisCookie.split("=")[0]=="qty"){
    querystring=thisCookie;
    expireDate=thisCookie.split("exp=")[1];
    }}}}
    if (querystring){
    querystring=querystring.split("&");
    qty=querystring[0].split("=")[1]; if (qty==""){qty="0";}qty=parseInt(qty);
    sub=querystring[1].split("=")[1]; if (sub==""){sub="0.00";}
    }
    update=document.write("Items in cart: "+qty+"<br>Subtotal: "+sub+"");
    return update;
    }
    </script>

    </head




    <body>

    <script type="text/javascript">upDate()</script>
    <a href="http://ww12.aitsafe.com/cf/review.cfm?userid=E9120065&amp;return=www.malsforms.com/display-cart.html">View your cart/checkout</a>

    <form action="http://ww12.aitsafe.com/cf/addmulti.cfm"; method="post">
    <input type="hidden" name="userid" value="E9120065">
    <input type="hidden" name="return" value="www.maheybrothers.com/testcart.html">;
    <input type="hidden" name="nocart">


    <input type="hidden" name="productpr1" value="Taffeta Velvet, :20.00:1">
    Color:<select name="product1[]">
    <option selected="Red">Red</option>
    <option value="White">White</option>
    <option value="black">black</option>
    </select>
    Quantity:<input type="text" name="qty1" size="2">

    <br>

    <input type="hidden" name="productpr2" value="Satin, :20.00:1">
    Color:<select name="product2[]">
    <option selected="Red">Red</option>
    <option value="White">White</option>
    <option value="black">black</option>
    </select>
    Quantity:<input type="text" name="qty2" size="2">


    <input type="submit" value="Order my Cider">



    <input type="reset" name="Clear your selection" value="Clear your selection">
    <input type="submit" name="Submit" value="Add to order" onclick="alert('Order has been added to your cart\n\nThis page will refresh');">
    </form>
    </body>
    </html>



    Aug 27 2011 07:21:07

    #8

    anandmahey

    Join date : 2011-08-25      Posts : 11

    On the other hand, I think a clear all button might be harmful. If accidentally clicked, it will clear the whole order.



    Aug 27 2011 07:31:59

    #9

    GT

    Join date : 2008-09-18      Posts : 3239

    Even with that basic page you seem to have got things wrong:
    http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.maheybrothers.com%2Ftestcart.html

    Change:
    selected="Red"
    to
    value="red"

    Change:
    select name="product1[]" and product2[]
    to
    select name="productpr1" value="Taffeta Velvet, :20.00:1"
    repeat for 2

    Remove your script and noscript from out side of the html.

    Change this in your noscript from:
    alt="web hosting" />
    to
    alt="web hosting">

    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 29 2011 03:26:34

    #10

    anandmahey

    Join date : 2011-08-25      Posts : 11

    hey thanks GT. Will amend those.

    Any advise on the clear selection button which updates the cart as well? Rather than a clear all button, maybe a clear selection button would be better. The current one just clears the quantity, but does not update the cart.



       1   |   2      »