Multiple sortable

[ndamnjanovic]

Hi there,

Is there a plan to extend this directive to support multiple sorting?

[thgreasi]

Please elaborate on the desired behavior (about multiple sorting).

[ndamnjanovic]

I would like to have possibility to select more than one item, and move it. Something like jquery ui sortable with connected lists.

[thgreasi]

I'm not aware of such a feature in the vanilla jquery ui sortable (when it was released?).

Did you gave it a try without any results? Because, as README states:

All the jQueryUI Sortable options can be passed through the directive.

Can you provide an example/demo or reference?

[ndamnjanovic]

Hey, sorry for late response.
Here's the jsfiddle for the thing I've been working on.

It allows multi-selecting (try to hold CTRL and select cities).
However it's not working if you return element on same position, it just disappears (because I detached it previosly). I've been banging my head to create workaround and fix it, but without luck. Then I saw your directive, but it doesn't allow multiple elements to be dragged.

http://jsfiddle.net/ndamnjanovic/swt48/

Not sure if I can fork your directive and tweak it somehow, to support this behaviour.

[thgreasi]

Take a look at line 158. This was needed for proper handling of incomplete sortings.

Since such a feature is not part of angular-ui-sortable, I think that it shouldn't be merged into master. Like cloning, the user if free to implement it or follow the suggested solution found in README (see #139 for details).

On the other hand, it would be nice if we could create a code example, a branch or even a seperate directive that would work on top of ui-sortable to provide an elegant solution for this use case.

[thgreasi]

Ideally we could create a seperate directive ui-multi-select to handle the on-click selection and then on ui-sortable utilize the options to pass proper helper & stop methods.

Finally the implementation should look like this:

<ul ui-sortable="opts" ui-multi-select model="list">
    <li ng-repeat="item in list">{{ list.text }}</li>
</ul>

PS: I think something like this, should be merged in jquery-ui and not be implemented in angular.

update: maybe the selection directive should be placed to the <li>.

[ndamnjanovic]

Thanks for prompt response. I see what you mean. I'm currently in a bus, so I'm reading this on my phone. I'll take a closer look this evening, once I get home.

[thgreasi]

Any progress over there?

I`m might have solved the problem...
I will create a fork (tomorrow) that will host a seperate directive and a factory that seems to work (at least for one/same list sorting). They actually cooperate with the ui-sortable directive.

The html should look like

<div ui-sortable="sortableOptions" ng-model="list" class="list">
  <div ui-sortable-selectable ng-repeat="item in list" class="item">
    {{item.text}}
  </div>
</div>

[thgreasi]

I just created ui-sortable-multiselection repo to host a directive that provides a possible solution to the problem. It's early days, I never tried using it with connected lists, but it's a proof of concept.

[ndamnjanovic]

Hey sorry for delay again, I'm currently on some IT conference, I'll take a look at guides you gave me, and this repo. I switched on another project this week with tons of new stuff, so I didn't have time to check it closer, although I need to. Thanks for help!