Drag and drop rearranging an array (list)

#1

I know it looks like I’m being really lazy, but could someone please point me to a simple working demo of using drag and drop to rearrange a simple array/list?

It only needs to rearrange the list with drag and drop and work with aurelia-cli (require). Ideally it would look like the oribella simple-Y example.

I’ve looked at oribella-aurelia-sortable, aurelia-sortablejs and either can’t get them to install or there is not enough documentation.

The other options such as Dragula are just overkill for my needs, and even then I couldn’t find an example which shows how to re-arrange a simple list.

I’ve also looked at sortablejs and jquery-ui but don’t have the skills to turn it into a component that I can use in aurelia.

Many thanks

#2

check out this 2 repos


#3

I am the author. Thanks Alex for sharing them. I have been planning to rewrite the doc in next few months, then share to the community.

The current doc is OK, not that bad. reorderable-repeat is deadly simple, a good feature for everyone. Most of you would not need to go down to bcx-aurelia-dnd.

#4

Wow - that’s just such an amazing component!

It works like pure magic!

The minimum default configuration does exactly what I need - no more and no less.

Thank you so much
Jeremy

#6

@stoffeastrom instructions are undiscoverable (-: from the readme that is.

#7

@Alexander-Taran Actually there is a big fat link that says Usage but that failed miserable obviously :wink:

#8

well for myself… I expect to have basic instructions on how to install the package in the readme.
obviously I do not read it all.
I scan the structure and when I see the pattern… git clone… npm install…
I make my conclusion.

I think I might not be the only one (-:

#9

Yep I missed the big usage link, I would expect the link to be in the usage section not the header itself

#10

Hi all, new here, just wanted to say we have been using oribella-aurelia-sortable and it’s just perfect.
Especially the possibility of dragging and dropping between different array lists is very nice…

#11

@mttmccb Yes that makes sense!
@klaa12924 Sounds great!

#12

Hi @stoffeastrom the underneath oribella looks interesting, do you have some demo pages for that project? Is aurelia-gestures the main/only interface to use oribella?

#14

Man, please spend some time on documentation. I thought I am bad, you did even less than me.

Thx for your code sample. It will definitely help when I want to provide better mobile support.

#15

(post withdrawn by author, will be automatically deleted in 24 hours unless flagged)

#16

what happened to the repos? they are all archived now?

#17

Did @stoffeastrom take @huochunpeng too seriously? I think he meant it in jest.

#18

Somehow he was marked as “spam”

#19

What the hell is happening?? Does core-team have the visibility of who flagged @stoffeastrom posts?

It looks like someone misunderstood discourse’s flag as a sort of “like”.

#20

@Alexander-Taran it is in the readme of archived repos. He merged all repos into one by using lerna, similar to what Aurelia wants to do.

#21

For record, I have cleaned up both content and css of document for bcx-aurelia-dnd and bcx-aurelia-reorderable-repeat.

Most noticeably, implemented a new feature for reorderable-repeat to support reordering across multiple lists, while keep the simplicity.

#22

for those looking for a simple example of how to do this without a plugin check this out: https://github.com/jbockle/au-drag-example