RasterTabbarEvent
Object passed to a tab bar event handler containing information about the event in progress. The object has the following properties:event The associated DOM event object. type Indicates the type of event. tabbar The tab bar control that issued the event. item Points to the item being click or moved. dragValue The value being dragged/dropped over the control. position Indicates where the dragged value is about to be dropped.Not all object properties apply to all event types. When a property is not relevant to a given event type, its value is set to
null
(Tip: do an alert()
on the event object to see which properties are set for any particular event type).
The
type
property indicates what the event does. The following table
lists its possible values:
Event Type Description
clickA tab item was clicked. The
item
property
points to the tab item being clicked. Cancelling this event
will prevent the tab from become active/selected.
contextA tab item was right-clicked. The
item
property
points to the tab item being clicked. This might be used to
open a context menu at the mouse position.
beforedragA tab item is about to be dragged. The
item
property points to the tab item about to be
dragged. Cancelling this event
will prevent the drag operation from occurring.
overA value is being dragged over a tab item. The
item
property points to the tab item currently
under the mouse pointer. The dragValue
property contains the value
being dragged over the item. The position
property indicates where the
dragged value is about to be dropped in relation to the tab item
.
If the event handler wishes to accept the
dragValue
at the current position,
it must invoke RasterEvent.accept()
to signal the control to
highlight the item
as a potential drop target (i.e. draw insertion line
or shaded box at the item's location).
The event handler may overwrite the current
position
by passing a
new position
to the accept()
method.
If the event handler does not invoke accept()
, the item
will not be highlighted as a potential drop target, nor the "drop"
event will fire on the item
if the mouse button is released over the item.
dropA value was dropped over an item. The
item
property
points to the tab item receiving the drop. The dragValue
property
contains the value dropped over the item
. The position
property indicates where the dragValue
was dropped in relation
to the item
.
Moving Local Items
When dragging and dropping items inside the same control, the drag operation is said to be "local". In such case, the control's default behavior is to reorganize the dropped items automatically after the event handler returns from a "drop" event. If the event handler wishes to prevent the default "reorganize" behavior, it must invoke
RasterEvent.cancel()
before it returns. Note: When reorganising
local items in a tab bar, a drop position
equal to "over" will be treated as "before".
Example: Hooking up a tab event handler
var tab = new RasterTabbar("myTabDiv", true ); //Add tabs tab.add( ICONS16.GROUP, "Users" ).select(); //set as active tab tab.add( ICONS16.FILM, "Media" ); tab.add( ICONS16.MONEY, "Billing" ); tab.setCustomizable(true); //Allow tab re-ordering tab.setEventHandler( myHandler ); //Set event handler ... function myHandler( evt ) { switch ( evt.type ) { case "click" : alert ( evt.item.text + " clicked!" ); break; } }