Drag and Drop using Knockout and HTML5

References for Drag and Drop using Knockout have improved dramatically over the last 8 months. It looks like many of these have been around for a while, but the search results have improved, making them more accessible.

I found this post useful:
http://stackoverflow.com/questions/7218171/knockout-html5-drag-and-drop

Especially this fiddle:
http://jsfiddle.net/marrok/m63aJ/

This also looks like a well refined binding:
https://github.com/One-com/knockout-dragdrop

complete with a nice demo:
http://one-com.github.io/knockout-dragdrop/

Still many of the results depend on JQuery UI integration, but Knockout and HTML5 and these approaches make it much easier to handle drag and drop without limiting yourself to JQuery UI approaches.

Drag and Drop

Drag and drop is a useful element in user interfaces. HTML5 brings drag and drop to the browser by default. Incorporating it with a project is not so easy to get the hang of (at least it's not for me!).

I found these articles to be useful when trying to implement a knockout based sortable list, as found in the "trees" project. (see that for samples)

http://www.html5rocks.com/en/tutorials/dnd/basics/
https://www.google.com/search?q=dragstart+dragstart.h5s&client=ubuntu&channel=cs&aq=f&oq=dragstart+dragstart.h5s&aqs=chrome.0.57.8634&sourceid=chrome&ie=UTF-8#hl=en&gs_rn=8&gs_ri=psy-ab&gs_mss=dragstart.h5s&pq=dragstart&cp=10&gs_id=25&xhr=t&q=dataTransfer&es_nrs=true&pf=p&client=ubuntu&channel=cs&sclient=psy-ab&oq=dataTransf&gs_l=&pbx=1&bav=on.2,or.r_qf.&bvm=bv.44770516,d.aWc&fp=1f3254f3ac0d9180&biw=1043&bih=702
https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop
https://developer.mozilla.org/en-US/docs/DragDrop/DataTransfer
https://www.google.com/search?q=knockout+sortable+binding&client=ubuntu&channel=cs&aq=f&oq=knockout+sortable+binding&aqs=chrome.0.57.4419&sourceid=chrome&ie=UTF-8#hl=en&client=ubuntu&channel=cs&sclient=psy-ab&q=knockout+drag+and+drop+binding&oq=knockout+drag+binding&gs_l=serp.1.0.0i7.887233.887754.0.890243.4.4.0.0.0.1.144.493.0j4.4.0...0.0...1c.1.8.psy-ab.6O_DVvQElZg&pbx=1&bav=on.2,or.r_qf.&bvm=bv.44770516,d.aWM&fp=1f3254f3ac0d9180&biw=1043&bih=702
https://github.com/bramstein/knockout.dragdrop
https://github.com/bramstein/knockout.dragdrop/blob/master/lib/knockout.dragdrop.js
https://github.com/rniemeyer/knockout-sortable
https://github.com/rniemeyer/knockout-sortable/blob/master/src/knockout-sortable.js
https://developer.mozilla.org/en-US/docs/DOM/Mozilla_event_reference/dragstart
http://www.knockmeout.net/2011/05/dragging-dropping-and-sorting-with.html
http://www.ko-js.com/2012/04/part-1-sortable-list-in-knockout-js.html
http://www.ko-js.com/2012/04/part-2-sortable-list-in-knockout-js.html

https://www.google.com/search?q=html5+drag&client=ubuntu&channel=cs&aq=f&oq=html5+drag&aqs=chrome.0.57.3075&sourceid=chrome&ie=UTF-8