views:

34

answers:

1

Hey guys,

I've wrote some jquery code with some draggable elements and one droparea.

Unfortunately my droparea can't make a difference between various object.

Here's my code.

<script type="text/javascript">

    $(function() {

        $("#droparea").droppable({
            drop: function(event) {
                var $target = $(event.target);

                if($target.is("#flyer")) {
                    alert("adasd");
                 }
                   else if($target.is("#flyer2")) {
                    alert("adasd2");
                 }
            }
        });

    });


</script>

</head>
<body>
<div id="droparea"></div>

<div class="polaroid" id="flyer">
    <img src="images/muesliFlyer.png" alt="flyer" />
</div>

Without the if it works. But then I can't get the dropped object.

Any ideas why my target isn't recognized?

thanks a lot.

+1  A: 

The way to get the dropped element is to have two parameters to your drop method (generally event and ui) and get the "draggable" property from the ui parameter.

    $("#droparea").droppable({
        drop: function(event, ui) {
            var $target = ui.draggable; //note: draggable is a jQuery object

            if($target.is("#flyer")) {
                alert("adasd");
            }
        }
    });
JacobM
`ui.draggable` you mean :)
Nick Craver
Thanks a lot. I didn't thought it was so simple :) If I use if .. else if .. it won't work any more. ?!
rdesign
@Nick Craver -- yep. Fixed it. Thanks!
JacobM