Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Posts: 30
Registered: ‎02-04-2011
My Device: BB9900 & PlayBook16GB
My Carrier: Rogers

JQuery .sortable() not functioning using WebWorks for PlayBook


Most of jQuery functionality I have played with is supported, I however am I unable to use .sortable().

Following is the code:




$(document).ready(function() {
  $(function() {
  $("#content ul").sortable();



The result was tested in Firefox, Chrome and Safari. On the Simulator, clicking on the <li> items does nothing while dragging it moves the page up and down rather than moving the elements.


Simulator version 0.9.2 jQuery version 1.5(also tested with 1.3.2, no luck).


I have seen the SketchPad Example, and document.ontouchmove, but hope this is achievable using only jQuery, for higher cross compatibility.

Any help would be appreciated.

New Developer
Posts: 46
Registered: ‎01-14-2011
My Device: BB10
My Carrier: ATT

Re: JQuery .sortable() not functioning using WebWorks for PlayBook

This would be nice but I don't think any touch device supports jQuery sortable.

marcucio.com - productivity apps
New Contributor
Posts: 4
Registered: ‎02-06-2011
My Device: Not Specified

Re: JQuery .sortable() not functioning using WebWorks for PlayBook

Suppose you have a canvas with an id of 'mycanvas'.  Try the following:


$('body').delegate('#mycanvas', 'touchstart', function(e){


 var x = e.originalEvent.changedTouches[0].pageX - $(this).offset().left;
 var y = e.originalEvent.changedTouches[0].pageY - $(this).offset().top;
 //x and y are the points of the canvas for the event




You can also use 'touchend' and 'touchmove' in addition to 'touchstart'.


If you are using the latest version of JQuery, then you should be fine; however, earlier versions do not have the delegate function, so use bind or live functions instead.


Just as a note, this will probably only work on an actual touch screen device.  In the SketchPad tutorial, I believe mousevents are used to emulate this behavior.  I tested similiar code on an actual android device, which is also webkit based like the playbook.