rniemeyer / knockout-sortable

A Knockout.js binding to connect observableArrays with jQuery UI sortable functionality
MIT License
548 stars 128 forks source link

Duplicate is getting created after drop. #162

Open rishabhdev opened 8 years ago

rishabhdev commented 8 years ago

sourceParent.splice(sourceIndex, 1); At line 256, observable array is getting modified but is not reflected in the view. Thats why duplicates are created.

rniemeyer commented 8 years ago

@rishabhdev - Can you provide some type of code / demonstration of your issue? Perhaps using jsFiddle or another tool, so that I can try to help diagnose your issue?

altschuler commented 8 years ago

This might be the same issue: http://stackoverflow.com/questions/37786778/knockout-sortable-makes-duplicates-making-a-tree-structure

Fiddle: http://jsfiddle.net/yyqnhngm/

To reproduce drag either A or B into the other.

Ratcreamsoup commented 7 years ago

I've got the same problem as @rishabhdev; unfortunately this is some backend code that I cannot disclose and the application is quite complex - it is an observable array of observable arrays (i.e. sortable categories containing sortable items, each with a number of observable properties). I tried to simplify the example in a fiddle, however when I do that, I can no longer reproduce the problem at all, even though the nesting level is the same.

There used to be a line ko.removeNode(el); just below the sourceParent.splice(sourceIndex, 1); until v0.8.7; if I revert to that version or if a simply add back this one statement to the current v1.1.0, the problem disappears. I currently don't quite see what harm may be done by adding this back in our why exactly it was removed back in v0.8.8.

I am currently still in the process of investigating this issue further in hopes of finding a clean (i.e. non-fork, not downgrade to 0.8.7) solution. I also try to tweak the fiddle some more to get to a point where the problem can be reproduced. It would be helpful however if somebody could explain the code changes from 0.8.7 to 0.8.8.

Ratcreamsoup commented 7 years ago

Ha! I had a hunch and landed a catch - here's the fiddle that shows the issue: https://jsfiddle.net/mwollny/p0vz5Lc0/

The problem here arises through the dynamic assignment of templates to the sortable items (template: $root.templateToUse). The fiddle has just one such template, so it seems superflous, however in our case each category can hold items of different types, each of these types uses its own template for rendering and the template to use is determined by a property of the item.

If the template is static (i.e. template: 'tpl_item'), there is no such problem: https://jsfiddle.net/mwollny/p0vz5Lc0/3/

edit: This is the same issue as has already been reported in #150 and #144, so the same workaround applies here: stripping the whitespace between the <script> and the outermost elements of the templates - see https://jsfiddle.net/mwollny/p0vz5Lc0/4/.

This may also be the cause of the problems with @rishabhdev 's report, but he'll have to confirm after checking his code.