jquery - jQuery UI のソート可能なイベントが複数回発生する

Question

私は 1 つのプロジェクトで作業しており、jQuery UI Sortable および Draggable に基づいています。問題は、ソート可能なイベントが複数回発生することです。（私は検索を使用しました）。

JSがあります：

$('.column_inner').sortable({
    item: '.element',
    revert: 'invalid',
    helper: 'original',
    handle: '.drag_handle',
    dropOnEmpty: true,
    forcePlaceholderSize: true,
    forceHelperSize: false,
    appendTo: "body",
    connectWith: '.column_inner',
    receive: function(event, ui) {
        //Got the item and if it new inserting it from database.
    },
    update: function(event, ui) {
        //Saving sorting in to database
    },
    change: function(event, ui)
    {
        //This one fires multiple times, over does the same.
    },
    stop: function()
    {
        //This one fires only at stop
    }
});

HTMLがあります：

<div class="row" id="row_115">
    <div class="column size_3" rel="1">
        <div class="column_inner">
            <div id="element_23" class="element editable">
                This is element
                <span class="drag_handle control_icon">Handle</span>
            </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <span class="up">UP</span> <span class="down">DOWN</span>
</div>

<div class="row" id="row_117">
    <div class="column size_half" rel="1">
        <div class="column_inner">
            <div id="element_20" class="element editable">
                Another element<br />
                <span class="drag_handle control_icon">Handle</span>
            </div>
        </div>
    </div>
    <div class="column size_half" rel="2">
        <div class="column_inner">
            <div id="element_20" class="element editable">
                Third element<br />
                <span class="drag_handle control_icon">Handle</span>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <span class="up">UP</span> <span class="down">DOWN</span>
</div>

私は何を間違えましたか？イベントが複数回発生するのはなぜですか?