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
anddataMimeType
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
Properties Summarized
A data object that specific events can set, a user can set data back to the system for events that supports this.
Methods Summarized
returns the name of the element, can be null if the form was the source of the event.
Returns the x 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
Sample
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
Sample
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
Sample
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
Sample
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
Sample
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
Sample
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
Sample
//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
Sample
//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
Sample
//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
Sample
//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
Sample
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
Sample
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
Sample
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
Sample
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
Sample
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
Sample
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
Sample
// 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 a string representing the MIME type of the event data.
Sample
// 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 a DRAGNDROP constant, representing the result of the drag action
Sample
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 a String representing the element name.
Sample
if (event.getElementName() == 'myElement')
{
elements[event.getElementName()].bgcolor = '#ff0000';
}
getFormName()
returns the name of the form the element was placed on.
Returns: String a String representing the form name.
Sample
forms[event.getFormName()].myFormMethod();
getModifiers()
Returns the modifiers of the event, see JSDNDEvent.MODIFIER_XXXX for the modifiers that can be returned.
Returns: Number an int which holds the modifiers as a bitset.
Sample
//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 name of event as string
Sample
var name = event.getName();
getRecord()
Returns the record of the event.
Returns: JSRecord Record of the event
Sample
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 an Object representing the source of this event.
Sample
// 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 a Date when this event happened.
Sample
event.getTimestamp();
getType()
returns the dnd event type see the JSDNDEvents constants what it can return.
Returns: String a String representing the type of this event.
Sample
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 an int representing the X position.
Sample
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 an int representing the Y position.
Sample
var y = event.getY();
var yPrevious = previousEvent.getY();
var movedYPixels = y -yPrevious;
Last updated
Was this helpful?