in one of my partials, I was using the following code (made it short..)
<ul id="list_works" class="works" style="height:248px; overflow: scroll;"> <% for work in @works %> <li id="work_<%= work.id -%>" ><p><%= work.title -%> </p></li> <%= draggable_element "work_#{work.id}", :revert => true %> <% end %> </ul>
due to an issue with the overflow:scroll + drag/drop , I need to change the helper for a more complicated script, and I don't see how to set the id of the <li> , something like "work_<%= work.id -%>" or "work_#{work.id}" the script is the following : where xxx should be the work.id
<script type="text/javascript"> if(navigator.userAgent.indexOf("MSIE") != -1) { document.getElementById("list_works").style.position = "relative"; // needed so that draggables scroll new Draggable('work_xxxx', { revert: true, ghosting: false, onStart: function() { document.getElementById("list_works").style.position = "static"; }, onEnd: function() { document.getElementById("list_works").style.position = "relative"; } }); } else { new Draggable('work_xxx', { revert: true, ghosting: true }); }; </script>
btw this script runs well, and help drag an item from a overflow:scroll container above all other areas.... just need to load <script src="http://www.google.com/jsapi"></script> before prototype and scriptaculous....
thanks for any clue .....