options

defines tabs in a tabbar

Example

webix.ui({
    view:"tabbar",
    id:"tabbar",
    value:"listView", // the initially selected tab
    multiview:true,
    options: [
        { id:"listView", value:"List" },
        { id:"formView", value:"Form" },
        { id:"emptyView", value:"Empty" }
    ]
});

Related samples

The property expects an array of either strings or objects.

Short Form

If you pass the array of strings, they will serve both as the labels and the IDs:

webix.ui({
    view:"tabbar",
    value:"One",
    options:[
        "One","Two","Three"
    ]
});

Detailed Form

A more detailed way to set options is to pass an array of objects, each with 4 attributes:

• id - (string, number) the item ID, which serves as the real value of the option for inner logic,
• value - (string) the item label, which is the displayed string of the option,
• width - (number) the item width,
• close - (boolean) adds the "close" icon to the tab, false by default for the selected option,
• hidden - (boolean) defines whether the item will be hidden initially (false by default).

Back to top