Re: Using DataTable with Drag and Drop: Part II
- Hey Satyam,
I've got a couple of breakthroughs on my end of things. After working
with your example and some of my own code I was able to solve a couple
To begin with I, for now, opted not to switch over to your new method
of only having one drag and drop listener on the table. Most of what
I have done is based on your previous version.
I was able to solve the disappearing borders problem by providing an
empty event handler override for the DDProxy row element as follows:
var ddRow = new YAHOO.util.DDProxy(sourceDT.getTrEl(i));
ddRow.onDragDrop = function(e, id)
..... previously discussed code .....
ddRow.endDrag = function(e)
Doing this prevents some of the style changes that the default DDProxy
endDrag method would make, namely hiding the element. It also
prevents the DDM from moving the element to its destination location.
I can't see that this causes any harm anywhere so it seems like a
clean solution to me. Also, for my application I did not define any
of the other DDProxy overrides, only the two above.
As for the selection bug, I have yet to come up with a better
solution. What I have done in testing is turn every tr in the source
table into a DDProxy upon build (which I know is not a good solution
once the table grows to any large size). I still added:
With this setup the selection seems to work normally in the manner
that we would want. I don't really understand how this fixed the
situation. The reason I did the pre-DDProxy creation was simply
because I found it irritating to have to click on a row once before
clicking and dragging could take place.
I hope this is of some interest to you since you've been so helpful to me.
At this point I've got my DataTables dragging and dropping how I want
for my application so I'm moving on to my next big problem which I
will be creating a new post about shortly.
- One more thing! I implimented this code in my application. You'll
recognize the parts that I carried over from your example. I figured
that the invoice example on your site could, like my application,
benefit from an extra step which would check the see if you've
modified to quantity to 0 and, if so, delete that row from the invoice.
I was proud of myself for coming up with this (don't laugh) so I
thought I'd share it with you.
if (oArgs.editor.cell.innerHTML == 0)
row = this.getTrEl(oArgs.editor.cell);
record = this.getRecord(row);