Carro de compras con drag y drop

[andrea55]

Hola! estoy usando el carrito siguiente;

http://projects.sevir.org/storage/jQ...&dsample2.html

despues que el usuario selccione los articulos a comprar, como sé que artículos han sido seleccionados? para poder hacer una factura?

Gracias!

[chalchis]

mm otra alternativa

http://www.webresourcesdepot.com/aja...t-with-jquery/


saludos

[Panino5001]

Bueno, hay que mirar un poco el código y ver cómo funciona.
Aquí le pongo 2 alerts que luego podrás reemplazar por lo que necesites:

Código PHP:

  <script type="text/javascript"> 
    $(document).ready(function(){
        $("#cart").Droppable(
            {
                accept :        'products', 
                activeclass:    'cart-active',
                hoverclass:        'cart-hover',
                ondrop:            function (zone, drag) 
                                {   
                                    if ($("#"+ drag.id + "_cart").size() == 0){
                                        alert('se ha agregado:'+drag.id);
                                        $("#items").append('<div id="' + drag.id + '_cartTitle"></div><div id="' + drag.id + '_cart"></div>');
                                    }            
                                    $("#"+ drag.id + "_cart").append('<img src="' + drag.src +'" class="cart-items" alt="' + drag.id + '" />');
                                    $("#"+ drag.id + "_cartTitle").html(drag.alt + " (" + $("img",document.getElementById(drag.id + "_cart")).size() + ")");
                                    $(".cart-items").Draggable(
                                        {
                                            zIndex:     1000,
                                            ghosting:    true,
                                            revert:     true,
                                            opacity:     0.7,
                                            fx:            200
                                        }
                                    );
                                },
                tolerance:        'pointer'
            }
        );
        
        $("#wastebin").Droppable(
            {
                accept :        'cart-items', 
                activeclass:    'wastebin-active',
                hoverclass:        'wastebin-hover',
                ondrop:            function (zone, drag) 
                                {
                                    alert('se ha removido:'+drag.alt);
                                    $(drag).remove();
                                    if ($("img",document.getElementById(drag.alt + "_cart")).size() == 0){
                                        $("#"+ drag.alt + "_cartTitle,#" + drag.alt + "_cart").remove();
                                    }else{
                                        $("#"+ drag.alt + "_cartTitle").html($("#" + drag.alt).get(0).alt + " (" + $("img",document.getElementById(drag.alt + "_cart")).size() + ")");
                                        ;
                                    }
                                },
                tolerance:        'pointer'
            }
        );
        
        $(".products").Draggable(
            {
                zIndex:     1000,
                ghosting:    true,
                revert:     true,
                opacity:     0.7,
                fx:            200
            }
        );
        
    });
</script>