Simple Jquery Question

Question

HI there ... im am trying to create a simple Jquery within Droppable. The page works and allows me to drop a video onto the selected droppable area (div class="roundedVideoDrop"), but I want to stop the user from being able to drop more than 1 video in each div, which has been created.

My code for this is :

$("div.roundedVideoDrop").droppable({
            activeClass: 'highlight',
            hoverClass: 'highlight-accept',
            drop: function(event, ui){
                if $(this).sibling('video').count() == 0 {
                    return true;
                } else {
                    return false;
                }  

What im attempting to do is to check and see if there is another sibling (i.e another within the ) if there is then the video being dragged cannot be dropped into the , otherwise it is allowed.

This will not work, in fact is kicking up a parse error within Safari and I have been trying all morning to get it working but no luck. Could anyone tell me the correct way of doing it?

Thanks so much

Answer 1

Try $(this).sibling('video').size() instead of $(this).sibling('video').count()

Answer 2

You need to use children not siblings if you are looking inside the current drop zone

$("div.roundedVideoDrop").droppable({
            activeClass: 'highlight',
            hoverClass: 'highlight-accept',
            drop: function(event, ui){
                return  !$(this).children('video').length;
            }