I need to implement a directive in ionic :
This directive have to allow the user to drag and drop some elements in a div or remove them.
I used to do that with jQuery UI but because jQuery is not recommended with angular, i am looking for a compatible way with ionic and mobile gestures.
(Future app is for Ipad only)
Thanks for help.
Now really much of an issue with ionic…
You should check this post out
I implemented a drag and drop with jQuery UI and JQueryUI Touch Punch.
But i need to write some extensions to simulate a ‘delay’ when dragging starts and then prevent the default scroll behave.
It is not the best solution, but i needed drag, drop with combination of sortable lists.
On slow, old devices it is a little bit laggy.
This doesn’t work with ios, but works on chrome during development
I didn’t try with android, I continue testing …
@rdb any success on this?
No success on real device…
but I think it is realizable
it is not working in mobile devices and even on emulator, but perfectly working on desktop.
i want to know is it possible to achieve the drag and drop in ionic framework.
It is possible, but it will require some work
You could work from the tinder card example.
Or try this module out, which supports touch events
Be sure to include data-tap-disabled=“true” on the element you want to drag
hey @mhartington i tried out the ngDraggable module it is working fine in browser. but in emulator it is not working. i even placed the data-tap-disabled=“true” but no outcome.
hey finally i got it worked with ngDraggable. Thanks
post me sample example of drag and drop @kishorekik
hello @chaith123 i used the code from ngDraggable Module Demo.
once you download it from git https://github.com/fatlinesofcode/ngDraggable, demos code can be available to you. i just used the same code. that’s it
thanks for @kishorekik
In browser it is working not in emulator in which area to place data-tap-disabled=“true” below is my example link
which area to place data-tap-disabled=“true” help me
its working in emulator also
I have had a lot of success with ngDraggable. Here is a code pen of a basic implementation.
its working drag and drop. issue is drag particular one element showing behind the box. drag the element shows like this
help me guys
thanks in advance
I realize this was a while back, but I can’t seem to get the ngDraggable to work for the life of me. I’ve put the
data-tap-disabled="true" on the elements I want to drag and the area in which I want the areas to be re-ordered in (yes I need the reorder part) but to no avail.
Please help me out!