Toon posts:

[AJAX/JS/Prototype] Drag 'n Drop Shop met lightbox

Pagina: 1
Acties:

Onderwerpen


Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
Hi,

Even een vraag. Ik heb een php pagina die een aantal producten weergeeft. Elk product bevindt zich in een <li></li>, elke <li> heeft een unieke ID. Deze <li> heb ik dmv Script.Aculo.Us drag&dropbaar gemaakt. Het idee is dat wanneer ik hem op een specifieke plek "neergooi" hij aan een winkelwagen wordt toegevoegd. Nu is dit prima gelukt, alleen kom ik in de problemen wanneer ik de "drop-plek" probeer een fixed positie te geven dmv css. De hotspot blijkt namelijk tijdens het scrollen niet mee te lopen... als ik namelijk een product op de "originele" plek van de dropbox gooi (waar hij staat als de pagina voor t eerst geladen wordt) wordt mijn ajax call namelijk wel uitgevoerd.

Dit is de dropbox nu...

HTML:
1
2
3
4
5
6
    <div id="dropbox" style="height:200px; width:300px; border:1px solid #CCD; position:fixed; left:50%; top:50%; margin-top:-100px; margin-left:-150px; z-index:999">Sleep hier Uw product naartoe om deze toe te voegen aan uw winkelmandje.</div>
        <script type="text/javascript">
        //<![CDATA[
        Droppables.add("dropbox", {onDrop:function(element){new Ajax.Request('/products/add', { method:'post', parameters:'id=' +element.id, onComplete:function(response){$('items').innerHTML = response.responseText},onFailure:function(response){$('items').innerHTML = response.responseText}})}})
        //]]>
    </script>


iemand een oplossing hiervoor?

Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
Heb zelf de oplossing gevonden... excuus niet genoeg gezocht!

Het blijkt dmv een kleine aanpassing aan de prototype source toch goed mogelijk. Zie de post van Chris Iufer op de volgende link indien je ook de oplossing zoekt: http://wiki.script.aculo....us/discuss/Droppables.add