<div class="meta" robots="noindex">

</div>

Class

# WebToolbarMenu

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

<div class="warning">

<div class="title">

Warning

</div>

This item was deprecated in version 2021r3. There is no replacement.

</div>

## Description

A button with a popout menu in a `WebToolbar</api/user_interface/web/webtoolbar>`. Clicking it will display a menu. The button cannot use the toggled appearance that a `WebToolbarButton</api/user_interface/web/webtoolbarbutton>` has.

## Properties

<div class="rst-class">

table-centered_columns_3_and_4

</div>

| Name                              | Type                                               | Read-Only | Shared |
|-----------------------------------|----------------------------------------------------|-----------|--------|
| `Badge<webtoolbarmenu.badge>`     | `String</api/data_types/string>`                   |           |        |
| `Caption<webtoolbarmenu.caption>` | `String</api/data_types/string>`                   |           |        |
| `Enabled<webtoolbarmenu.enabled>` | `Boolean</api/data_types/boolean>`                 |           |        |
| `Icon<webtoolbarmenu.icon>`       | `WebPicture</api/graphics/webpicture>`             |           |        |
| `Menu<webtoolbarmenu.menu>`       | `WebMenuItem</api/user_interface/web/webmenuitem>` |           |        |
| `Tag<webtoolbarmenu.tag>`         | `Variant</api/data_types/variant>`                 |           |        |
| `Tooltip<webtoolbarmenu.tooltip>` | `String</api/data_types/string>`                   |           |        |
| `Visible<webtoolbarmenu.visible>` | `Boolean</api/data_types/boolean>`                 |           |        |

## Property descriptions

<div id="webtoolbarmenu.badge">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Badge

**Badge** As `String</api/data_types/string>`

A small graphical element used to displayed additional information alongside the `WebToolbarItem</api/user_interface/web/webtoolbaritem>`.

The text appears in white on a round rectangle with a red background.

<div id="webtoolbarmenu.caption">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Caption

**Caption** As `String</api/data_types/string>`

The text of the label for the toolbar menu button. The Caption is displayed below the icon if there is one.

The Caption can be surrounded by "\<raw\>\</raw\>" tags to temporarily disable HTML parsing. For example, you could bold just a single word in a Caption by doing this:

``` xojo
button.Caption = "<raw><b>bold</b></raw> text"
```

This code changes the caption for an existing menu button on the toolbar:

``` xojo
Var button As WebToolbarMenu
button = WebToolBarMenu(Toolbar1.ItemWithName("ChartsButton"))

If button <> Nil Then
  button.Caption = "New Caption"
End If
```

<div id="webtoolbarmenu.enabled">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Enabled

**Enabled** As `Boolean</api/data_types/boolean>`

Used to set the item to appear enabled or disabled. If `True</api/language/true>`, the item is enabled.

This code changes disables an existing menu button on the toolbar:

``` xojo
Var button As WebToolbarMenu
button = WebToolBarMenu(Toolbar1.ItemWithName("ChartsButton"))

If button <> Nil Then
  button.Enabled = False
End If
```

<div id="webtoolbarmenu.icon">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Icon

**Icon** As `Picture</api/graphics/picture>`

A 32 x 32 pixel icon that is displayed in the toolbar menu. Setting the icon to nil will cause the item to have no icon, and the appearance will be adjusted accordingly.

This code changes the icon for an existing menu button on the toolbar:

``` xojo
Var button As WebToolbarMenu
button = WebToolBarMenu(Toolbar1.ItemWithName("ChartsButton"))

If button <> Nil Then
  button.Icon = ChartIcon ' ChartIcon is an icon added to the project
End If
```

<div id="webtoolbarmenu.menu">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Menu

**Menu** As `WebMenuItem</api/user_interface/web/webmenuitem>`

This property needs to be set to the menu to be displayed when the user clicks the item.

This example populate the WebToolbarMenus ChartsButton in the Open event of the `WebToolbar</api/user_interface/web/webtoolbar>`:

``` xojo
' Create the chart menu
Var chartMenu As New WebMenuItem
chartMenu.Append(New WebMenuItem("Line"))
chartMenu.Append(New WebMenuItem("Bar"))
chartMenu.Append(New WebMenuItem("Pie"))
chartMenu.Append(New WebMenuItem("-"))
chartMenu.Append(New WebMenuItem("3D Line"))
chartMenu.Append(New WebMenuItem("3D Bar"))
chartMenu.Append(New WebMenuItem("3D Pie"))

' Assign the menu to the WebToolbarMenu button by looking it up by name
WebToolBarMenu(Me.ItemWithName("ChartsButton")).Menu = chartMenu
```

<div id="webtoolbarmenu.tag">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Tag

**Tag** As `Variant</api/data_types/variant>`

A hidden value associated with the `WebToolbarItem</api/user_interface/web/webtoolbaritem>`.

Since this is a `Variant</api/data_types/variant>`, this can be used to associate any type of data, even an object, with the `WebToolbarItem</api/user_interface/web/webtoolbaritem>`.

<div id="webtoolbarmenu.tooltip">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Tooltip

**Tooltip** As `String</api/data_types/string>`

A helpful message that describes the purpose of the `WebToolbarItem</api/user_interface/web/webtoolbaritem>`.

<div id="webtoolbarmenu.visible">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebToolbarMenu.Visible

**Visible** As `Boolean</api/data_types/boolean>`

Indicates whether or not the WebToolbarItem is visible.

This property is useful when you need to hide/show WebToolbarItem's dynamically at runtime.

## Notes

See the WebControl.Shown event for an example of populating a menu. It is assigned to a <span class="title-ref">WebToolbarMenu</span> via setting the Menu property. Menu selections are handled by the WebToolbar.MenuAction event. See that event for an example.

## Sample code

This example populate the WebToolbarMenus ChartsButton and DatesButton in the Open event of the `WebToolbar</api/user_interface/web/webtoolbar>`:

``` xojo
' Create the chart menu
Var chartMenu As New WebMenuItem
chartMenu.Append(New WebMenuItem("Line"))
chartMenu.Append(New WebMenuItem("Bar"))
chartMenu.Append(New WebMenuItem("Pie"))
chartMenu.Append(New WebMenuItem("-"))
chartMenu.Append(New WebMenuItem("3D Line"))
chartMenu.Append(New WebMenuItem("3D Bar"))
chartMenu.Append(New WebMenuItem("3D Pie"))

' Assign the menu to the WebToolbarMenu button by looking it up by name
WebToolBarMenu(Me.ItemWithName("ChartsButton")).Menu = chartMenu

' Create the Dates menu
Var dateMenu As New WebMenuItem
dateMenu.Append(New WebMenuItem("Today"))
dateMenu.Append(New WebMenuItem("Tomorrow"))
dateMenu.Append(New WebMenuItem("Next Week"))
dateMenu.Append(New WebMenuItem("Next Month"))

' Assign the menu to the WebToolbarMenu button by looking it up by name
WebToolBarMenu(Me.ItemWithName("DatesButton")).Menu = dateMenu
```

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Menu selection is handled in the MenuAction event of the toolbar. In this case, the event handles both menus. Because it handles actions from several menus, the event is passed two parameters, Item As <span class="title-ref">WebToolbarMenu</span> and Choice As WebMenuItem. In this case, the event handler is:

``` xojo
Select case Item.Name
Case "ChartsButton"
    LastAction.Text = "You selected " + choice.Text + " from the Charts menu."
Case "DatesButton"
    LastAction.Text = "You selected " + choice.text + " from the Dates menu."
End Select
```

## Compatibility

Web projects on all supported operating systems.

## See also

`WebToolbarItem</api/user_interface/web/webtoolbaritem>` parent class; `WebMenuItem</api/user_interface/web/webmenuitem>`, `WebToolbar</api/user_interface/web/webtoolbar>`, `WebToolbarButton</api/user_interface/web/webtoolbarbutton>`, `WebToolbarContainer</api/deprecated/webtoolbarcontainer>`, `WebToolbarFlexibleSpace</api/deprecated/webtoolbarflexiblespace>`, `WebToolbarSeparator</api/deprecated/webtoolbarseparator>`, `WebToolbarSpace</api/deprecated/webtoolbarspace>` classes.
