Question

I am using jquery ui 1.7.2 alongwith jquery 1.3.2

The following script is causing drop event to be triggered twice.. I tried a lot of time but not able to figure out why?

any suggestions to fix this code

$("document").ready(function () {

    $(".draggable").draggable({
        revert: "invalid",
        helper: "clone",
        connectToSortable: ".column"
    });

    $(".column").droppable({
        accept: ".draggable",
        drop: function (event, ui) {
            debugger;
            var ordinalNo = 1;
            $(".column .contentObject").each(function () {
                ordinalNo = ordinalNo + 1;
            });

            var objectId = guidGenerator() + '_' + ordinalNo;
            var objectType;
            var contentObjContent = "<div id=\"" + objectId + "\" ><h2>[<span class=\"ordinal\"></span>] ";

            if (event.srcElement.id === "tableobj") {
                objectType = tableSource;
            }
            else if (event.srcElement.id === "chartobj") {
                objectType = chartSource;
            }
            else if (event.srcElement.id === "textobj") {
                objectType = textSource;
            }

            $.ajax({
                url: "/ContentBuilder/ContentObject",
                data: {
                    viewObjectId: objectId,
                    contentObjectId: null,
                    contentObjectTypeId: objectType,
                    contentObjSourceId: null,
                    ordinal: ordinalNo
                },
                type: "POST",
                success: function (data) {
                    contentObjContent = data;
                }
            });
        }
    });
    $(".column").sortable({
        connectWith: '.column',
        handle: 'h2',
        cursor: 'move',
        placeholder: 'placeholder',
        forcePlaceholderSize: true,
        opacity: 0.4,
        update: function (event, ui) {
            changeOrdinal();
            if (event.srcElement.id.length <= 0) {
                updateObjectOrdinals();
            }
        }
    }).disableSelection();

    $(".tablecolumn").sortable({
        connectWith: '.tablecolumn',
        handle: 'h2',
        cursor: 'move',
        placeholder: 'placeholder',
        forcePlaceholderSize: true,
        opacity: 0.4,
        update: function (event, ui) {
            changeColumnOrdinal();
        }
    }).disableSelection();
});

Answer 1

becouse you use dropable AND sortable on the same selector $(“.column”). I think both triggering a drop.