KNOWLEDGE BASE
Log In    |    Knowledge Base    |    4D Home
Tech Tip: The drag-and-drop of one array element from one array to another
PRODUCT: 4D | VERSION: | PLATFORM: Mac & Win
Published On: February 14, 2002
Your current browser may not allow you to download the asset. We recommend Mozilla Firefox or Google Chrome.
Log In

Version: 6.5.x and 6.7.x

The following technique gives the user an ability to drag-and-drop an array element from one array object to another. It also allows the user to rearrange the order of the element by dragging and dropping an element within the same array.


In this example, three scrollable arrays are created.




Figure 1:


- Step1


Each object has the following options turned on in the Property List.

1. Dragable

2. Dropable

3. On Clicked (event)

4. On Drop (event)


- Step2

Declare a process pointer variable in the form method

For example:


If (Form event=On Load )

 C_POINTER(vArrayPtr)

End if


- Step3


Place the following code in each Object Method of all scrollable areas


Case of

 : (Form event=On Clicked )

  vArrayPtr:=Self

 : (Form event=On Drop )

  C_LONGINT($InsertPosition)

  $InsertPosition:=Drop position



  ` the element is dragged and dropped within the same array

If (vArrayPtr=Self)



 If ($InsertPosition=-1) ` the element is dropped at the end of array

  $InsertPosition:=Size of array(Self->)+1

  INSERT ELEMENT(Self->;$InsertPosition;1)

  Self->{$InsertPosition}:=Self->{Self->}

  DELETE ELEMENT(Self->;Self->;1)

 Else ` the element is dragged and dropped on top of another element

  C_TEXT($TempElem)

  $TempElem:=Self->{$InsertPosition}

  Self->{$InsertPosition}:=Self->{Self->}

 Self->{Self->}:=$TempElem

 End if



Else ` the element is dragged and dropped from one array another



 If ($InsertPosition=-1) ` the element is dropped at the end of array

  $InsertPosition:=Size of array(Self->)+1

 End if

  INSERT ELEMENT(Self->;$InsertPosition;1)

  Self->{$InsertPosition}:=vArrayPtr->{vArrayPtr->}

  DELETE ELEMENT(vArrayPtr->;vArrayPtr->;1)

 End if

End case


Here are some examples of the expected behaviors


This is the initial state:




The following picture illustrates the result from a drag-and-drop of "Add" of Group1 onto "Lisa" of Group2.



"Add" then becomes the 3rd element and "Lisa" becomes the 4th element in Group2.


"Sam" is dragged from Group1 and dropped on top of "Add."



"Sam" and "Add" have switched their positions.


"Bob" is dragged from Group2 and dropped onto "Jane" in Group3.



"Bob" becomes the 2nd element, "Jane" becomes the 3rd element, and "Mary" becomes the 4th element in Group3.