Help with 'Create a single Add to Cart/Buy Now button, with a menu to select which item to buy'

[twisted]

I have two questions about the code for creating add to cart with menu :

1 - Can it be setup so that you can select multiple options? For example, if you want Mac AND PC?

2 - Any input on how to skin the menu? Like the options here: http://demo2.woothemes.com/sliding/shop/addicted-to-woo/



<form action="https://www.e-junkie.com/ecom/gb.php?c=cart&cl=XXXXXX&ejc=2" target="ejejc" method="POST" accept-charset="UTF-8">

<select name="i">

<option value="YYYYYY">Windows</option>

<option value="ZZZZZZ">Macintosh</option>

</select><br>

<input src="http://www.e-junkie.com/ej/ejadd_to_cart.gif" alt="Add to Cart" class="ec_ejc_thkbx" onclick="javascript:return EJEJC_lc(this.parentNode);" type="image" border="0">



Thanks!

[E-junkie_Monster]

Hello,



There's quite a bit of customization that can be applied to our cart buttons when variants/variations are involved, but things as in depth as you are describing are beyond the support we can directly provide.



I'd recommend contacting one of the developers in our directory here to can provide these kind of additional customizations:

http://www.e-junkie.com/ej/developer-directory.htm

[twisted]

I understand. Forget about the skinning question...



To be clear about adding multiple items to the cart with one button:



Are you saying it is or isn't possible to have select multiple checkboxes and one add to cart button? If it is, what does it require (changes to the form code, javascript or ejunkie code somewhere? If you could tell me where to begin that would be great.



Thanks.

[E-junkie_Monster]

It is possible, but it is one of those things we can't give you step by step instructions on. But the basic idea would be similar to the process discussed here:

http://www.e-junkie.com/ej/tips.variants.button-tutorial.htm



That page describes how to create a series of product URLs that contain the variant choices already programmed in, you would want to create an interface on your site so that the appropriate product and variant choices are added to our cart based on the checkboxes your buyer clicked before pressing your button. That is something an experienced developer can create for you in addition to customizing the appearance of the buttons on your site.

[twisted]

Thanks!

[E-junkie_Guru]

This discussion explains how to create a single Add to Cart button that adds multiple items to the buyer's cart:

http://www.e-junkie.com/bb/topic/2121



However, combining that with the item-menu approach, if it's even possible, would require custom scripting in your page.

[twisted]

Ok, so I had a friend do this and it seems to work. He wasn't happy that there wasn't documentation (or at least I couldn't find any) and the solution requires Jquery. If you'd like to HIRE him, visit his site http://mattmower.com/ DO NOT contact him with questions or asking for help.



XXXXXX = your client id

YYYYYY = product 1

ZZZZZZ = product 2

Copy/paste to add more products:

<input class="product_choice" type="checkbox" name="i" value="ZZZZZZZ" /><label for="checkbox4">Product 2</label>





CODE BEGINS>>>>>



<script type="text/javascript">

var product_urls = [];

function tt_url_for_product_with_code( code ) {

return "https://www.e-junkie.com/ecom/gb.php?c=cart&i="+code+"&cl=XXXXXXXXXXX&ejc=2";

}

jQuery(document).ready( function() {

jQuery('input.product_choice').click( function() {

product_urls = [];

jQuery('input.product_choice').each( function( idx, elem ) {

if( jQuery(elem).is(":checked" ) ) {

product_urls.push( tt_url_for_product_with_code( jQuery(elem).attr( "value" ) ) );

}

});

if( product_urls.length < 1 ) {

jQuery("a.open_cart").attr( "href", "#" ).attr( "target", null );

} else {

jQuery("a.open_cart").attr( "href", "javascript:EJEJC_multiAdd(product_urls)" ).attr( "target", "ej_ejc" );

}

});

});

</script>

<form id="product_selection">

<input class="product_choice" type="checkbox" name="i" value="YYYYYYYY" /><label for="checkbox2">Product 1</label>

<input class="product_choice" type="checkbox" name="i" value="ZZZZZZZ" /><label for="checkbox4">Product 2</label>

<a class="open_cart" href="#"><img src="http://www.e-junkie.com/ej/ejadd_to_cart.gif" alt="Add to Cart" border="0" /></a>

</form>

[E-junkie_Guru]

Thanks for sharing your solution. The multiAdd function is an unofficial hack but pretty self-evident to configure. Presumably you and Matt were wanting more documentation other than what's provided in our help pages, so what sort of documentation were you looking for?

[twisted]

You're welcome. I think he wanted a comprehensive developer resource with info about your javascript. All we could find was other forum posts that mentioned multiAdd being a hack. I can't really say though as I didn't understand much. I will ask though.

[adamv]

This solution has worked well for me. Most of my products have multiple options. Using the MultiAdd function has allowed me to have my customers select the options for multiple products, click one Add to Cart, and they all add to cart perfectly.



An example is here:



http://www.backyardgamez.com/backyard-games.php?product=BOARDDECAL&mode=read



Well done eJunkie! Took me less than an hour to add a cross-selling platform like Amazon's (of course more simplified lol).