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 click A 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. context A 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. beforedrag A 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. over A 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.
drop A 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;
    }
}

See Also

Home Examples Download License
 
Copyright © 2010-2017 Edwin R. López