All items in a sortable column become draggable; only the parent divs should become draggable

[rniemeyer]

All items in a sortable column become draggable; only the parent divs should become draggable

[rniemeyer]

The sortable binding works best when the "template" is a single element. You will have better luck wrapping it with something like:

<div data-bind="sortable:items">
   <div>
       <div id="i1">item 1
          <div id="nested_div">nested</div>
       </div>
       <div id="i2">item 2</div>
   </div>
</div>

[MattFriedman]

I see what you mean; in fact my template has a single element per item. The snippets I used were for illustration of the result.

So, if I look at your example from your comment I'd be able to drag nested_div out of its parent.

That's what I'm observing. Sorry, I don't have a test case. If needed I can probably get something going on jsfiddle.

[rniemeyer]

Yes, if it is possible to get something in jsFiddle it would be helpful. I will try to see if this plugin can address the issue or if it at the very least needs to be a documentation point.

[MattFriedman]

I was using:

sortable: {
                    options:{containment:$('#column-container'), items: 'div'},
                    data:items,
                    afterMove: afterMoveCallback.bind($data)
                }

so it was my bad. It was selecting all the divs, regardless of nesting. I added the parent level class of the items and now it works as expected.

This is what I have now.

sortable: {
                    options:{containment:$('#column-container'), items: 'div.item'},
                    data:items,
                    afterMove: afterMoveCallback.bind($data)
                }

So, not a bug I'm pretty sure.

Thanks,
Matt