Basic Drag Drop Blocks

Runtime drag and drop behavior is browser dependent.  If the same page is viewed on two different browsers, or possibly two different versions of the same browser, the drag and drop behavior may work differently.

Basic Drag Drop blocks allow the user to display records from a database table in different containers on a screen and then, using the mouse, move the records from one container to another.  The view or table assigned to the drag and drop block must contain fields defining the container in which the record is displayed, the location of the record on the X axis (horizontal), and the location of the record on the Y axis (vertical).  When a record is moved from one container to another on the screen, the location fields and container field is updated to the new value.  

Containers can be defined as read only to prevent the data from being moved to other containers, can be defined with varying widths, and can be restricted to a specific number of records.

The records within the container have a header block and an detail block.  The detail block can be defined as collapsible, which means that it can be displayed or hidden during runtime with the click of the mouse.

The following is an example of a Basic Drag Drop block.  Each record in this image can be dragged from one container to another using the mouse.  Clicking on the example/collapse image will display the collapsible detail block or hide it.

Rules for Basic Drag Drop Blocks

  1. When a Basic Drag Drop block is created, two sub blocks are created.  The block with the lowest Z order is the header block, and the block with the higher Z order is the detail block.  The header block cannot be deleted, but the detail block can.  

  2. No additional blocks can be added to the main Drag Drop block, unless there is no detail block, in which case one can be added, if it is associated with the query defined for the main Drag Drop block.

  3. Additional fields can be added to the header and detail blocks, only if they are labels or images.  Additional blocks cannot be added to the header and detail blocks.

  4. A query must be assigned to the Basic Drag Drop main block, and it must include fields defining the container in which the record is displayed, the location of the record on the X axis (horizontal), and the location of the record on the Y axis (vertical).

  5. Containers are automatically generated at runtime, within the area specified.  They are automatically sized to contain the necessary number of objects.  The location of the object in the container is determined by the values in the database for the X and Y columns for the record.

  6. If a record in the database has a null container number, or the container number is greater than the number of containers generated, the record will not be output.

  7. When objects are dragged from one container to another, they are moved to the top of all the other objects.

Basic Drag Drop Designer Tool

The Designer Tool is different for Basic Drag Drop blocks because the header and detail blocks within the Drag Drop block need to be manipulated at the same time.  In the Designer Tool, the drag drop block will have its own view on the View pop-list using the block's name.

Once you are viewing it, you will see both the header and detail blocks at the same time.  Sizing the blocks will size both of them at the same time.

Other than that, manipulation of the size and location of the fields in the Designer Tool is as normal.