Welcome!

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

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

JQuery .sortable() not functioning using WebWorks for PlayBook

Hello.

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

Following is the code:

 

 

<script>

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

</script>

 

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.

Please use plain text.
Contributor
marcucio
Posts: 41
Registered: ‎01-14-2011
My Device: Not Specified

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

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

Mike
Get It Done Tasks
http://getitdoneapp.com
Please use plain text.
New Contributor
kperson
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.

Please use plain text.