knockoutjs sortable binding - how to get targetparentnode?

Question

I have a list of sortable lists, and I am dragging some items into those lists.

I need to know the id of the list I am saving the item into so I can create a link record and save this on the server end.

Each sortable list has DOM element name equal to the ID of that list.

The awesome knockoutjs sortable binding has arg.sourceParentNode but not arg.targetParentNode. How can I obtain the targetParentNode?

Thanks!

I am building a screen to link things together, basically just create relationships between database tables and insert a record into the many-to-many table. I hope it is just simple simple I am missing here...

I can't be the only one who would find it useful to know which DOM element corresponds to which observableArray, so I'm hoping I'm missing something simple here and someone has an easy solution to this. I always found it strange that knockout doesnt have a DomElementForObservable function, but in the past I was able to always work around that and not need it. In this case I'm stumped. Any ideas?

A generic way to obtain a DOM element for an observable would be awesome.

Answer 1

A good option is to try to put this functionality in the view model rather than relying on the DOM elements. For example, you can attach an id to the observableArray rather than the DOM element. Like:

this.myItems = ko.observableArray();
this.myItems.id = "myId";

Then, you can just look at arg.targetParent.id.

Alternatively, you can subscribe in your viewmodel like:

this.myItems.subscribe(function(newValue) {
   this.createLink("myItems", newValue); //or whatever you need to do in your code
}, this);

The beforeMove and afterMove handlers to pass the event and ui objects on as the second and third arguments, so you could inspect them and find the parent of the element.

Knockout does not have a generic way to get a DOM element from an observable, as an observable may be bound to many elements. Hope this gives you some ideas though.