Well, I managed to figure this one out myself. I ended up adding the following line to my drop funciton:
$(ui.helper).remove(); I also changed the helper option in the draggable declaration to "clone". This appears to have done the trick. Thanks! Bob On Nov 9, 9:32 am, bgibilaro <[email protected]> wrote: > Hello, > > I am having an issue with a jQuery UI script I am trying to write that > will allow me to do drag and drop re-ordering of a table's columns. (I > am a big of a jQuery noob, so excuse if I am missing anything > obvious). > > You can see the issue I am having if you go > tohttp://www.crazymutthosting.com/jQueryTesting/testing2.html. Try > dragging one of thecolumnheaders (defined as draggable) over one of > the yellowcolumnseparators (defined as droppable). > > Thecolumnis moved after the droppable target (cloned and inserted, > actually) and, currently, the originalcolumnis simply hidden, > although I plan to remove it all together in the final version. > However, you will notice that they header is moved far off to the > right. It is almost as if when it clones thecolumnheader, it is also > cloning the offset value and applying that to the new one. > > Here is my jQuery code: > > //set all th elements in the header row to be draggable items... > $("tr.rpt_header_row th").not('.sep').draggable({ revert: 'valid' }); > > $(".sep").droppable({ > tolerance: 'touch', > hoverClass: 'ui-state-hover', > over: function(event, ui) { > $(this).css('width', ''+$(ui.draggable).width()+'px'); > }, > out: function(event, ui) { > $(this).css('width', '1px'); > }, > drop: function(event, ui) { > //get the index of thecolumnwe want to move and thecolumnwe are > placing it after... > var iDraggable = $(ui.draggable).prevAll().length + 1; > var iDroppable = $(this).prevAll().length; > > $('tblTest').add('td:nth-child(' + iDraggable + '),th:nth- > child(' + iDraggable + ')').each( > function() { > $(this).prev().add($(this)).clone > (false).insertAfter($(this).parent().children('td,th').eq(iDroppable - > 1)); > $(this).hide(); > $(this).prev('td,th').hide(); > } > ); > } > }); > > Any help would be greatly appreciated. > > Bob Gibilaro -- You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=.
