Forum: Ruby on Rails Capturing the position of a draggable element

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
A52f7c86d853547915be08746c608fd9?d=identicon&s=25 Jeannie Lu (jlu)
on 2006-01-13 23:53
I would like to capture the position of a draggable element after it's
being dragged, but I am running into problem using several options, such
as "change", "revert" and "onEnd".  My callback handler would only fire
when the page loads, and not when the element is dragged. How can I make
this happen?

<html>
<head>
 <script src="/scriptaculous-js-1.5.1/lib/prototype.js"
 type="text/javascript"></script>
 <script src="/scriptaculous-js-1.5.1/src/scriptaculous.js"
 type="text/javascript"></script>
</head>
<body>
 <table id="a">
   <tr>
    <td>draggable</td>
   </tr>
 </table>
<script type ="text/javascript" language="javascript">
 new Draggable('a',{onEnd:alert(this)});
</script>
 </form>
</body>
</html>
Eeba234182bcbd7faed9ff52e233394d?d=identicon&s=25 Douglas Livingstone (Guest)
on 2006-01-14 16:45
(Received via mailing list)
2006/1/13, jeannie lu <jeannielu@hotmail.com>:
> <script type ="text/javascript" language="javascript">
>  new Draggable('a',{onEnd:alert(this)});
> </script>

What that does, is assign the return value of "alert(this)" (probably
false or something) to options.onEnd. A simple way to do what you want
would be:

<script type ="text/javascript" language="javascript">
  new Draggable('a',{endeffect:function(){alert(this)}});
</script>

but a more powerful solution would be to create your own object to
handle the dragging, which would look something like this:

var MyDraggable = Class.create();
MyDraggable.prototype = {

    initialize: function (element, options) {
      // script.aculo.us drag and drop
      new Draggable(element, options);
      Draggables.addObserver(this);
    },

    onEnd: function () {

    // your code here

    }

}

hth,
Douglas
This topic is locked and can not be replied to.