Dragging and Dropping between lists Part 1: Properties
This is my first post in a series of posts about dragging and dropping between lists. I recently was reminded at how hard it is to get get your head around all the different properties (and events, styles, etc.. ) that can go onto a single Flex component. Ryan's post about this on Flex Coder's recently. He was asking how to copy an item from one List component to another using drag and drop. Today, I'm going to do a brain dump about the drag and drop features on lists.
When you want to drag and drop between lists, these are the properties and events you want to research more:
- dragEnabled: Specifies whether you can drag an item out of the List and drop it on another list. This will copy the item.
- dragMoveEnabled: Specifies whether an item can be moved from one list to another.
- dropEnabled: Specifies that items from other lists (or even the current list) can be dropped onto this control.
There are 8 combinations of these attributes that you can experiment with to accomplish what you need to accomplish:
- If you want to disable items from being added to other lists, set dragEnabled to false. I you set this, then dragMoveEnabled has no affect. You cannot move stuff from the list whether your intent is to move or copy.
- If you want to prevent items from being added to your list, set dropEnabled to false. People will not be able to drag items to your list.
- If you want to allow items to be added to your list, set dropEnabled to true, and people can drag items in. Depending on the settings of the source list, they can either copy an item to a list (meaning it is still in the original list) or move an item (meaning it is no longer in the original list).
- If you want to allow items from this list to be copied to another list, set dragEnabled to true.
- If you want to allow items from this list to be moved to another list, set dragMoveEnabled to true.
- If you set both dragEnabled and dragMoveEnabled to true, the default is to move an item, but if you hit the control key it will default to copy. ( This command may be operating system specific).
- If you want to prevent items from being added to the list, set dropEnabled to false.
- If you want to allow items on this list to be re-ordered by dragging, set dragEnabled to true and dropEnabled to true and dragMoveEnabled to true.
It can be frustrating when you know that some piece of functionality exists, but you just can't find the magic property to enable it. Coming into Flex cold, the number of properties available to any given component can be very intimidating. I'll admit, I'm still learning things every day. When first learning about dragging and dropping with lists, I came across a allowDragSelect property, which has nothing to do with dragging and dropping between lists, it is for comboBoxes. It happens to the best of us. I have a few follow up posts to this planned; one to talk about events relating to drag and drop and one to put it all together with a few code samples.




I wanted to test it before I responded. As far as I can tell there is no way "by default" to prevent an item from being copied. You'd have to write some code on the "drop" event to make sure that item does not already exist in the list and prevent it.
It's possible you could do something with a keyboard event to intercept / ignore the control key.