# JSDNDEvent

## Overview

The `JSDNDEvent` object is designed for use in drag-and-drop callback functions, offering detailed event information and support for client-server interaction. It integrates deeply with event management in scripting environments. ## Overview

### Key Features

* Constants for identifying event types (`ONDRAG`, `ONDROP`, etc.) and modifiers (`MODIFIER_ALT`, `MODIFIER_SHIFT`).
* Properties such as `data` and `dataMimeType` to handle event-specific data transfer.
* Methods for retrieving event details, such as `getDragResult()`, `getType()`, and positional data (`getX()`, `getY()`).

### Advanced Usage

The `JSDNDEventType` class facilitates JSON conversion for events in browser contexts. It ensures that events with a source are correctly handled, mapping them to client-side representations using a `WeakHashMap` for efficient reference management.

## Constants Summarized

| Type                                                                         | Name                               | Summary                                                             |
| ---------------------------------------------------------------------------- | ---------------------------------- | ------------------------------------------------------------------- |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [ACTION](#action)                  | Constant returned by JSEvent.                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [DATACHANGE](#datachange)          | Constant returned by JSEvent.                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [DOUBLECLICK](#doubleclick)        | Constant returned by JSEvent.                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [FOCUSGAINED](#focusgained)        | Constant returned by JSEvent.                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [FOCUSLOST](#focuslost)            | Constant returned by JSEvent.                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [FORM](#form)                      | Constant returned by JSEvent.                                       |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) | [MODIFIER\_ALT](#modifier_alt)     | Constant for the ALT modifier that can be returned by JSDNDEvent.   |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) | [MODIFIER\_CTRL](#modifier_ctrl)   | Constant for the CTRL modifier that can be returned by JSDNDEvent.  |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) | [MODIFIER\_META](#modifier_meta)   | Constant for the META modifier that can be returned by JSDNDEvent.  |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) | [MODIFIER\_SHIFT](#modifier_shift) | Constant for the SHIFT modifier that can be returned by JSDNDEvent. |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [NONE](#none)                      | Constant returned by JSEvent.                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [ONDRAG](#ondrag)                  | Constant returned by JSDNDEvent.                                    |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [ONDRAGEND](#ondragend)            | Constant returned by JSDNDEvent.                                    |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [ONDRAGOVER](#ondragover)          | Constant returned by JSDNDEvent.                                    |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [ONDROP](#ondrop)                  | Constant returned by JSDNDEvent.                                    |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [RIGHTCLICK](#rightclick)          | Constant returned by JSEvent.                                       |

## Properties Summarized

| Type                                                                         | Name                          | Summary                                                                                                           |
| ---------------------------------------------------------------------------- | ----------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| [Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object) | [data](#data)                 | A data object that specific events can set, a user can set data back to the system for events that supports this. |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [dataMimeType](#datamimetype) | The event data mime type.                                                                                         |

## Methods Summarized

| Type                                                                                       | Name                                | Summary                                                                                      |
| ------------------------------------------------------------------------------------------ | ----------------------------------- | -------------------------------------------------------------------------------------------- |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)               | [getDragResult()](#getdragresult)   | Returns the result of the drag action.                                                       |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)               | [getElementName()](#getelementname) | returns the name of the element, can be null if the form was the source of the event.        |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)               | [getFormName()](#getformname)       | returns the name of the form the element was placed on.                                      |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)               | [getModifiers()](#getmodifiers)     | Returns the modifiers of the event, see JSDNDEvent.                                          |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)               | [getName()](#getname)               | Returns the name of the event which was triggered                                            |
| [JSRecord](https://docs.servoy.com/reference/servoycore/dev-api/database-manager/jsrecord) | [getRecord()](#getrecord)           | Returns the record of the event.                                                             |
| [Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)               | [getSource()](#getsource)           | returns the source component/element of the event.                                           |
| [Date](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/date)                   | [getTimestamp()](#gettimestamp)     | Returns the time the event occurred.                                                         |
| [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)               | [getType()](#gettype)               | returns the dnd event type see the JSDNDEvents constants what it can return.                 |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)               | [getX()](#getx)                     | Returns the x position of the event, relative to the component that fired it, if applicable. |
| [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)               | [getY()](#gety)                     | Returns the y position of the event, relative to the component that fired it, if applicable. |

## Constants Detailed

### ACTION

Constant returned by JSEvent.getType() in a method that is attached to an onAction event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.ACTION)
{
	// its an action event.
}
```

### DATACHANGE

Constant returned by JSEvent.getType() in a method that is attached to an onDataChange event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.DATACHANGE)
{
	// its a data change event
}
```

### DOUBLECLICK

Constant returned by JSEvent.getType() in a method that is attached to an onDoubleClick event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.DOUBLECLICK)
{
	// its a double click event.
}
```

### FOCUSGAINED

Constant returned by JSEvent.getType() in a method that is attached to an onFocusGained or the forms onElementFocusGained event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.FOCUSGAINED)
{
	// its a focus gained event.
}
```

### FOCUSLOST

Constant returned by JSEvent.getType() in a method that is attached to an onFocusLost or the forms onElementFocusLost event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.FOCUSLOST)
{
	// its a focus lost event.
}
```

### FORM

Constant returned by JSEvent.getType() in a method that is attached to a form event (like onShow) or command (like onDeleteRecord)

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.FORM)
{
	// its a form event or command
}
```

### MODIFIER\_ALT

Constant for the ALT modifier that can be returned by JSDNDEvent.getModifiers();

**Type**\
[Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)

**Sample**

```js
//test if the SHIFT modifier is used.
if (event.getModifiers() & JSDNDEvent.MODIFIER_SHIFT)
{
	//do shift action
}
```

### MODIFIER\_CTRL

Constant for the CTRL modifier that can be returned by JSDNDEvent.getModifiers();

**Type**\
[Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)

**Sample**

```js
//test if the SHIFT modifier is used.
if (event.getModifiers() & JSDNDEvent.MODIFIER_SHIFT)
{
	//do shift action
}
```

### MODIFIER\_META

Constant for the META modifier that can be returned by JSDNDEvent.getModifiers();

**Type**\
[Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)

**Sample**

```js
//test if the SHIFT modifier is used.
if (event.getModifiers() & JSDNDEvent.MODIFIER_SHIFT)
{
	//do shift action
}
```

### MODIFIER\_SHIFT

Constant for the SHIFT modifier that can be returned by JSDNDEvent.getModifiers();

**Type**\
[Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number)

**Sample**

```js
//test if the SHIFT modifier is used.
if (event.getModifiers() & JSDNDEvent.MODIFIER_SHIFT)
{
	//do shift action
}
```

### NONE

Constant returned by JSEvent.getType() if the event is not used in a known event or command.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.NONE)
{
	// type is not set.
}
```

### ONDRAG

Constant returned by JSDNDEvent.getType() in a method that is attached to an onDrag event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSDNDEvent.ONDRAG)
{
	// its an ondrag event
	if (event.getElementName() == 'todragelement')
		return DRAGNDROP.COPY
}
```

### ONDRAGEND

Constant returned by JSDNDEvent.getType() in a method that is attached to an onDragEnd event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSDNDEvent.ONDRAGEND)
{
	// its an on drag end event.
	// return true if the drop has been completed successfully
	return event.isDropSuccess();
}
```

### ONDRAGOVER

Constant returned by JSDNDEvent.getType() in a method that is attached to an onDragOver event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSDNDEvent.ONDRAGOVER)
{
	// its an on drag over event.
	// return true if it over the right element.
	return event.getElementName() == 'candroponelement';
}
```

### ONDROP

Constant returned by JSDNDEvent.getType() in a method that is attached to an onDrop event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSDNDEvent.ONDROP)
{
	// its a on drop event.
	var element = elements[event.getElementName()];
	// do drop on element
	return true;
}
```

### RIGHTCLICK

Constant returned by JSEvent.getType() in a method that is attached to an onRightClick event.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

**Sample**

```js
if (event.getType() == JSEvent.RIGHTCLICK)
{
	// its a right click event.
}
```

## Properties Detailed

### data

A data object that specific events can set, a user can set data back to the system for events that supports this.

**Type**\
[Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object)

**Sample**

```js
// A client design method that handles ondrag
if (event.getType() == JSEvent.ONDRAG)
{
     // the data is the selected elements array
     var elements = event.data;
     // only start a client design drag when there is 1 element
     if (elements.length == 1)
     {
     	return true;
     }
}

// code for a data drag method
event.data = "drag me!";
return DRAGNDROP.COPY;

// code for a data drop method
var data = event.data;
elements[event.getElementName()].setText(data);
return true;
```

### dataMimeType

The event data mime type.

**Type**\
[String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) a string representing the MIME type of the event data.

**Sample**

```js
// only accept drag if data is a servoy record
function onDragOver(event)
{
	if(event.dataMimeType.indexOf("application/x-servoy-record-object") == 0) return true;
	else return false;
}
```

## Methods Detailed

### getDragResult()

Returns the result of the drag action.

**Returns:** [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) a DRAGNDROP constant, representing the result of the drag action

**Sample**

```js
function onDragEnd(event)
{
	var dragResult = event.getDragResult();
	if(dragResult == DRAGNDROP.NONE)
	{
		// the drag was canceled
	}
	else if(dragResult == DRAGNDROP.COPY)
	{
		// the drag ended with a copy action
	}
	else if(dragResult == DRAGNDROP.MOVE)
	{
		// the drag ended with a move action
	}
}
```

### getElementName()

returns the name of the element, can be null if the form was the source of the event.

**Returns:** [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) a String representing the element name.

**Sample**

```js
if (event.getElementName() == 'myElement')
{
    elements[event.getElementName()].bgcolor = '#ff0000';
}
```

### getFormName()

returns the name of the form the element was placed on.

**Returns:** [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) a String representing the form name.

**Sample**

```js
forms[event.getFormName()].myFormMethod();
```

### getModifiers()

Returns the modifiers of the event, see JSDNDEvent.MODIFIER\_XXXX for the modifiers that can be returned.

**Returns:** [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) an int which holds the modifiers as a bitset.

**Sample**

```js
//test if the SHIFT modifier is used.
if (event.getModifiers() & JSDNDEvent.MODIFIER_SHIFT)
{
	//do shift action
}
```

### getName()

Returns the name of the event which was triggered

**Returns:** [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) name of event as string

**Sample**

```js
var name = event.getName();
```

### getRecord()

Returns the record of the event.

**Returns:** [JSRecord](https://docs.servoy.com/reference/servoycore/dev-api/database-manager/jsrecord) Record of the event

**Sample**

```js
event.Record();
```

### getSource()

returns the source component/element of the event.\
If it has a name the getElementName() is the name of this component.

**Returns:** [Object](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object) an Object representing the source of this event.

**Sample**

```js
// cast to runtime text field (change to anoter kind of type if you know the type)
/** @type {RuntimeTextField} */
var source = event.getSource();
var sourceDataProvider = source.getDataProviderID();
```

### getTimestamp()

Returns the time the event occurred.

**Returns:** [Date](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/date) a Date when this event happened.

**Sample**

```js
event.getTimestamp();
```

### getType()

returns the dnd event type see the JSDNDEvents constants what it can return.

**Returns:** [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) a String representing the type of this event.

**Sample**

```js
if (event.getType() == JSDNDEvent.ONDROP)
{
	// it's a drop
}
```

### getX()

Returns the x position of the event, relative to the component that fired it, if applicable.\
For example drag'n'drop events will set the x,y positions.

**Returns:** [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) an int representing the X position.

**Sample**

```js
var x = event.getX();
var xPrevious = previousEvent.getX();
var movedXPixels = x -xPrevious;
```

### getY()

Returns the y position of the event, relative to the component that fired it, if applicable.\
For example drag'n'drop events will set the x,y positions.

**Returns:** [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) an int representing the Y position.

**Sample**

```js
var y = event.getY();
var yPrevious = previousEvent.getY();
var movedYPixels = y -yPrevious;
```

***