jquery - How to catch dragend event in JavaScript?

Question

I'm trying to catch the dragend event in JavaScript for a draggable DIV. The dragend event is not fired at all, why ? and how to solve this ? PS, I'm using .draggable() method from: jQuery UI 1.9.2

Here's my code: http://jsfiddle.net/vBMav/

HTML:

<div id="divId"> ... </div>

CSS:

#divId {
    background-color: #000000;
    color: #ffffff;
    height: 200px;
    width: 200px;
}

Javascript:

$('#divId').draggable(); 

$('#divId')
    .bind('dragstart', function(){ $("#divId").text("drag start"); })
    .bind('drag',      function(){ $("#divId").text("dragging");   })
    .bind('dragend',   function(){ $("#divId").text("drag ended"); });

Answer 1

Try using dragstop instead of dragend

.bind('dragstop',   function(){ $("#divId").text("drag ended");});