multiple selectors when using JQuery Droppables
<p>I have a carousel basket that needs to handle more than one selector to be dropped into it. There are youtube video that needs to be accepted (Selector: ".youtubevideo"), yahoo videos that need to be accpeted (Selector: ".yahoovideo"). Here is the code i will make the code more useable later on.</p>

<p>The items are dragging easily but the carousel wont accept two different selectors which are ".yahoovideo" and ".youtubevideo" why is this?</p>

<h2>DRAGGABLE</h2>

<pre><code>var count = 0;
var imageParams = '';
var idParams = '';
var pageType = '';
var titleParams = '';
$(".youtubevideo").multidraggable({
    'helper': 'clone',
    'revert': 'invalid',
    'cursorAt': { left: 0, top: 0 },
    'zIndex': 500,
    'distance': 10,
    start: function(event, ui) {

        count += 1;

        $(ui.helper).children().each(function() {
            $(this).remove();
        });


        $(ui.helper).css("width", "0%");
        $(ui.helper).css("paddingTop", "0px");
        $(ui.helper).css("paddingBottom", "0px");
        $(ui.helper).css("paddingLeft", "0px");
        $(ui.helper).css("paddingRight", "0px");

        if (GetViewSelected() == 'details') {

            var img = $(this).find(".divmediaresultsnavigationcontrolvideotitletext3hidden");

            imageParams += $($(img)[1]).text() + '~';
            var id = $(this).attr("id");
            id = id.split("limediaresultsnavigationcontroldetailscontainer")[1];
            idParams += id + '~';

            var title = $($($($(this).children()[0]).children()[0]).children()[2]).text();
            titleParams += title + '~';

            var className = $(this).attr("class");
            className = className.split(" ")[2];
            pageType = className;

        }
        else {

            //var img = $("a.linkmediaresultsnavigationcontrolcontainer").find('img');


            var img = $($($(this).children()[0]).children()[0]).children()[0];

            imageParams += $(img).attr("src") + '~';
            var id = $(this).attr("id");
            id = id.split("linkmediaresultsnavigationcontrolcontainer")[1];
            idParams += id + '~';

            var title = $($(this).children()[2]).text();
            titleParams += title + '~';

            var className = $(this).attr("class");
            className = className.split(" ")[2];
            pageType = className;
        }

        var countItems = $(".ui-multidraggable").size();

        if (count == (countItems / 2)) {

            var divContainer = $("&lt;div/&gt;")
            $(ui.helper).append(divContainer);
            $(divContainer).attr("id", "divContainerMultiDraggable");
            $(divContainer).css("paddingTop", "10px");
            $(divContainer).css("paddingBottom", "10px");
            $(divContainer).css("paddingLeft", "10px");
            $(divContainer).css("paddingRight", "10px");
            $(divContainer).css("backgroundColor", "black");
            $(divContainer).css("display", "inline-block");
            $(divContainer).text((countItems / 2) + " Items Selected");

            var divHiddenImageParams = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenImageParams);
            $(divHiddenImageParams).css("display", "none");
            $(divHiddenImageParams).text(imageParams);

            var divHiddenIDParams = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenIDParams);
            $(divHiddenIDParams).css("display", "none");
            $(divHiddenIDParams).text(idParams);

            var divHiddenPageType = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenPageType);
            $(divHiddenPageType).css("display", "none");
            $(divHiddenPageType).text(pageType);

            var divHiddenTitle = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenTitle);
            $(divHiddenTitle).css("display", "none");
            $(divHiddenTitle).text(titleParams);
        }
    },
    stop: function(event, ui) {

        count = 0;
        imageParams = '';
        idParams = '';

        $("#divContainerMultiDraggable").remove();

    }

});


var count2 = 0;
var imageParams2 = '';
var idParams2 = '';
$(".yahoovideo").multidraggable({
    'helper': 'clone',
    'revert': 'invalid',
    'cursorAt': { left: 0, top: 0 },
    'zIndex': 500,
    start: function(event, ui) {

        count2 += 1;

        $(ui.helper).children().each(function() {
            $(this).remove();
        });

        $(ui.helper).css("width", "0%");
        $(ui.helper).css("paddingTop", "0px");
        $(ui.helper).css("paddingBottom", "0px");
        $(ui.helper).css("paddingLeft", "0px");
        $(ui.helper).css("paddingRight", "0px");

        if (GetViewSelected() == 'details') {

            var img = $(this).find(".divmediaresultsnavigationcontrolvideotitletext3hidden");

            imageParams2 += $($(img)[1]).text() + '~';
            var id = $(this).attr("id");
            id = id.split("limediaresultsnavigationcontroldetailscontainer")[1];
            idParams2 += id + '~';

            var className = $(this).attr("class");
            className = className.split(" ")[2];
            pageType = className;

        }
        else {

            var img = $("a.linkmediaresultsnavigationcontrolcontainer").find('img');
            imageParams2 += $(img).attr("src") + '~';
            var id = $(this).attr("id");
            id = id.split("linkmediaresultsnavigationcontrolcontainer")[1];
            idParams2 += id + '~';

            var className = $(this).attr("class");
            className = className.split(" ")[2];
            pageType = className;

        }

        var countItems = $(".ui-multidraggable").size();

        if (count2 == (countItems / 2)) {

            var divContainer = $("&lt;div/&gt;")
            $(ui.helper).append(divContainer);
            $(divContainer).attr("id", "divContainerMultiDraggable");
            $(divContainer).css("paddingTop", "10px");
            $(divContainer).css("paddingBottom", "10px");
            $(divContainer).css("paddingLeft", "10px");
            $(divContainer).css("paddingRight", "10px");
            $(divContainer).css("backgroundColor", "black");
            $(divContainer).css("display", "inline-block");
            $(divContainer).text((countItems / 2) + " Items Selected");

            var divHiddenImageParams = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenImageParams);
            $(divHiddenImageParams).css("display", "none");
            $(divHiddenImageParams).text(imageParams2);

            var divHiddenIDParams = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenIDParams);
            $(divHiddenIDParams).css("display", "none");
            $(divHiddenIDParams).text(idParams2);

            var divHiddenPageType = $("&lt;div/&gt;");
            $(divContainer).append(divHiddenPageType);
            $(divHiddenPageType).css("display", "none");
            $(divHiddenPageType).text(pageType);
        }
    },
    stop: function(event, ui) {

        count2 = 0;
        imageParams2 = '';
        idParams2 = '';

    }

});
</code></pre>

<h2>DROPPABLE</h2>

<pre><code>var countDrop = 0;
var items = 0;
$(".carouselBody").droppable({
    accept: '.youtubevideo',
    drop: function(event, ui) {

        countDrop += 1;

        if (countDrop == 1) {
            items = $(".ui-multidraggable").size();

            var div = $("#divContainerMultiDraggable");
            var divImageParams = $($(div).children()[0]).text();
            var divIDParams = $($(div).children()[1]).text();
            var divTitleParams = $($(div).children()[3]).text();
            var divPageType = $($(div).children()[2]).text();


            $("div.divContainerMultiDraggable").remove();

            var ul = $(".carouselBody").find("ul");

            for (var i = 0; i &lt; divImageParams.split("~").length; i++) {

                var image = divImageParams.split("~")[i];
                var id = divIDParams.split("~")[i];
                var title = divTitleParams.split("~")[i];

                if (image != "") {

                    if ($("#listmediabasketitemcontainer" + id).length &gt; 0) {
                    }
                    else {
                        var li = $("&lt;li/&gt;");
                        $(ul).append(li);
                        $(li).attr("class", "listmediabasketitemcontainer");
                        $(li).attr("id", "listmediabasketitemcontainer" + id);
                        $(li).attr("title", title);

                        $(li).click(function() {

                            var tempClass = $(this).attr("class");
                            tempClass = tempClass.split(" ")[0];

                            if (selectedMultiDragContainer == "") {
                            }
                            else {

                                if (selectedMultiDragContainer == tempClass) {
                                }
                                else {
                                    $(".ui-multidraggable").removeClass("ui-multidraggable");
                                    $($(this).children()[0]).addClass("ui-multidraggable");
                                }

                            }

                            selectedMultiDragContainer = tempClass;


                        });


                        var div = $("&lt;div/&gt;");
                        $(li).append(div);
                        $(div).attr("class", "divmediabasketitemcontainer");


                        var divHiddenID = $("&lt;div/&gt;");
                        $(li).append(divHiddenID);
                        $(divHiddenID).css("display", "none");
                        $(divHiddenID).text(id);

                        var divHiddenPageType = $("&lt;div/&gt;");
                        $(li).append(divHiddenPageType);
                        $(divHiddenPageType).css("display", "none");
                        $(divHiddenPageType).text(divPageType);

                        var img = $("&lt;img/&gt;");
                        $(div).append(img);
                        $(img).attr("width", "100px");
                        $(img).attr("height", "100px");
                        $(img).attr("src", image);
                    }

                }

            }
            imageParams = '';
            idParams = '';
            $(".ui-multidraggable").removeClass("ui-multidraggable");
            DragDropMediaToPLaylistSelected();
        }
    },
    over: function(event, ui) {

        countDrop = 0;

    }

});


var countDrop4 = 0;
var items4 = 0;
$(".carouselBody").droppable({
    accept: '.yahoovideo',
    drop: function(event, ui) {

        countDrop4 += 1;

        if (countDrop4 == 1) {
            items4 = $(".ui-multidraggable").size();

            var div = $("#divContainerMultiDraggable");
            var divImageParams = $($(div).children()[0]).text();
            var divIDParams = $($(div).children()[1]).text();
            var divTitleParams = $($(div).children()[3]).text();
            var divPageType = $($(div).children()[2]).text();


            $("div.divContainerMultiDraggable").remove();

            var ul = $(".carouselBody").find("ul");

            for (var i = 0; i &lt; divImageParams.split("~").length; i++) {

                var image = divImageParams.split("~")[i];
                var id = divIDParams.split("~")[i];
                var title = divTitleParams.split("~")[i];

                if (image != "") {

                    if ($("#listmediabasketitemcontainer" + id).length &gt; 0) {
                    }
                    else {
                        var li = $("&lt;li/&gt;");
                        $(ul).append(li);
                        $(li).attr("class", "listmediabasketitemcontainer");
                        $(li).attr("id", "listmediabasketitemcontainer" + id);
                        $(li).attr("title", title);

                        $(li).click(function() {

                            var tempClass = $(this).attr("class");
                            tempClass = tempClass.split(" ")[0];

                            if (selectedMultiDragContainer == "") {
                            }
                            else {

                                if (selectedMultiDragContainer == tempClass) {
                                }
                                else {
                                    $(".ui-multidraggable").removeClass("ui-multidraggable");
                                    $($(this).children()[0]).addClass("ui-multidraggable");
                                }

                            }

                            selectedMultiDragContainer = tempClass;


                        });


                        var div = $("&lt;div/&gt;");
                        $(li).append(div);
                        $(div).attr("class", "divmediabasketitemcontainer");


                        var divHiddenID = $("&lt;div/&gt;");
                        $(li).append(divHiddenID);
                        $(divHiddenID).css("display", "none");
                        $(divHiddenID).text(id);

                        var divHiddenPageType = $("&lt;div/&gt;");
                        $(li).append(divHiddenPageType);
                        $(divHiddenPageType).css("display", "none");
                        $(divHiddenPageType).text(divPageType);

                        var img = $("&lt;img/&gt;");
                        $(div).append(img);
                        $(img).attr("width", "100px");
                        $(img).attr("height", "100px");
                        $(img).attr("src", image);
                    }

                }

            }
            imageParams = '';
            idParams = '';
            $(".ui-multidraggable").removeClass("ui-multidraggable");
            DragDropMediaToPLaylistSelected();
        }
    },
    over: function(event, ui) {

        countDrop4 = 0;

    }

});
</code></pre>
