TabControl.ItemMoved

Syntax

ItemMoved: function (sender, args:  PP.TabControlArgs);

Parameters

sender. Event source.

args. Event information.

Description

The ItemMoved event occurs after the tab is moved.

Comments

Tabs are moved using the Drag&Drop method

The event is relevant if the TabControl.DragDropEnabled property is set to true.

Example

To execute the example, connect the PP.js components library and the PP.css visual styles table. Create the TabControl component and add a handler for the ItemMoved event:

<script type="text/javascript">
    //Create the TabControl component:
    var tabcontrol = new PP.Ui.TabControl({
            //Identifier for the div tag
            ParentNode: document.getElementById("tabcont1"),
            Width: 250,
            Height: 50,
            //Path to the folder with images:
            ImagePath: "img"
        });
    //Add tabs to the TabControl component:
    tabcontrol.addItem(new PP.Ui.TabItem({ Position: PP.LTRB.Top, Caption: "First tab", Content: "Content 1" }));
    tabcontrol.addItem(new PP.Ui.TabItem({ Position: PP.LTRB.Top, Caption: "Second tab", Content: "Content 2" }));
    //Add a handler for the ItemMoved event
    tabcontrol.ItemMoved.add(function (sender, args) {
            args.Item.setCaption(args.Item.getOrderNumber().toString());
    });
</script>

After executing the example the HTML page contains the TabControl component that consists of two tabs named First tab and Second tab. After moving the tab its sequence number is set as its header.

See also:

TabControl