How can I disable Vertical Dragging in a sortable container?

Viewed 1482

I have 2 columns that I want to display in a sortable-container. One displays a list of all users ('friends' column) and the other starts off as empty ('selected' column). I want to be able to drag the users from the 'friends' column to the 'selected' column. This works as intended right now.

The problem is that when scrolling (especially on mobile), you can flick the users in the 'friends' column out of order. Since it starts out alphabetized this ruins the order as the user is looking for his friends to sort into selected. I would like to disable vertical dragging so that you can only drag from 'friends'->'selected' and vice versa. Any vertical dragging inside either column would be ignored. Is there a way to do this without using hammer.js, and is hammer.js easily applied to a jquery sortable container?

2 Answers
Related