PDA

View Full Version : Drag-and-drop



kovtik
6 Oct 2006, 1:57 AM
How can I remove DDTarget behavior from several rows in the grid? My grid has a windows explorer-style with files and folders. I want that I not be able to drag folders or files into file (red icon must appear in this case). After several items are dragged into folder I must update my data model to reflect changes. I found this code in your example:
var grid = new YAHOO.ext.grid.Grid('ddgrid1', dm, cm);
grid.enableDragDrop = true;
grid.render();
new YAHOO.util.DDTarget('ddgrid1', 'GridDD');What event should I process to remove DDTarget behavior from files in my grid (every time my DataModel changes) and how can I do this?

kovtik
6 Oct 2006, 2:02 AM
Or may be I should add DD and DDTarget behavior to every row of the grid separately?

kovtik
6 Oct 2006, 2:26 AM
I would also ask you about the event that grid fires after it has been rerendered. Method Grid.render() must be called once, but grid renders every time the data model changes. For example, I am using my custom rendering function to process cells in data column. This function creates several html elements with ids. So, what event should I process to be be sure that document.getElementById will return html element which was added by my render function?

jack.slocum
6 Oct 2006, 3:45 AM
1. That is tricky. It won't be simple to implement. Your logic might flow something like this:

- attach to the dragover event of the grid
- your drag over will be called with an event object "e" and dd object "dd". Use e to get the row the drag is currently over:


var xy = YAHOO.util.Event.getXY(e);
var cell = grid.getView().getCellFromPoint(xy[0], xy[1]);
if(cell){ // make sure it's even over a cell
var rowIndex = cell[1];
// use that rowIndex + your data model to determine if DD allowed
// if not allowed, this updates the icon
dd.setDropStatus(false);
// if allowed
dd.setDropStatus(true);
}

When they are dropped ('dragdrop' event) you will have to do the same check to determine the row they were dropped on and if it is valid.

It's not trivial, trust me. Check out the js from the post Drag and Drop with the Grid Part 2. It does some of these things and should serve as a good example.

2) I wouldn't recommend it.

3) Each rendering of a cell overwrites the previous contents, so your getElementById should be ok. The GridView doesn't fire events for rendering, instead it listens for events that cause it to render. You can listen for those events as well. They are defined on the data model.

kovtik
6 Oct 2006, 7:01 AM
1. That is tricky. It won't be simple to implement. Your logic might flow something like this...Great solution, it works fine :D ! Thank you very much.

jack.slocum
6 Oct 2006, 7:06 AM
Drag and drop is fun isn't it? ;)