Class

# WebMenuItem

<div class="rst-class">

forsearch

</div>

Menu

<div class="rst-class">

forsearch

</div>

MenuItem

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

## Description

An item in a contextual menu used in a web page or web control.

## Properties

<div class="rst-class">

table-centered_columns_3_and_4

</div>

| Name                                         | Type                                   | Read-Only | Shared |
|----------------------------------------------|----------------------------------------|-----------|--------|
| `Count<webmenuitem.count>`                   | `Integer</api/data_types/integer>`     | ✓         |        |
| `Enabled<webmenuitem.enabled>`               | `Boolean</api/data_types/boolean>`     |           |        |
| `Icon<webmenuitem.icon>`                     | `WebPicture</api/graphics/webpicture>` |           |        |
| `LastAddedIndex<webmenuitem.lastaddedindex>` | `Integer</api/data_types/integer>`     | ✓         |        |
| `Position<webmenuitem.position>`             | `Positions<webmenuitem.positions>`     |           |        |
| `Style<webmenuitem.style>`                   | `Styles<webmenuitem.styles>`           |           |        |
| `Tag<webmenuitem.tag>`                       | `Variant</api/data_types/variant>`     |           |        |
| `Text<webmenuitem.text>`                     | `String</api/data_types/string>`       |           |        |
| `TextColor<webmenuitem.textcolor>`           | `ColorGroup</api/graphics/colorgroup>` |           |        |

## Methods

<div class="rst-class">

table-centered_column_4

</div>

| Name                                             | Parameters                                                                                                                       | Returns | Shared |
|--------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------|---------|--------|
| `AddMenuItem<webmenuitem.addmenuitem>`           | text() As `String</api/data_types/string>`                                                                                       |         |        |
|                                                  | item As <span class="title-ref">WebMenuItem</span>                                                                               |         |        |
| `AddMenuItemAt<webmenuitem.addmenuitemat>`       | index As `Integer</api/data_types/integer>`, item As <span class="title-ref">WebMenuItem</span>                                  |         |        |
| `AddSeparator<webmenuitem.addseparator>`         |                                                                                                                                  |         |        |
| `AddSeparatorAt<webmenuitem.addseparatorat>`     | index As `Integer</api/data_types/integer>`                                                                                      |         |        |
| `Constructor<webmenuitem.constructor>`           | text As `String</api/data_types/string>` = "", tag As `Variant</api/data_types/variant>` = `Nil</api/language/nil>`              |         |        |
| `MenuItemAt<webmenuitem.menuitemat>`             | index As `Integer</api/data_types/integer>`                                                                                      |         |        |
|                                                  | index As `Integer</api/data_types/integer>`, `Assigns</api/language/assigns>` item As <span class="title-ref">WebMenuItem</span> |         |        |
|                                                  | index As `Integer</api/data_types/integer>`, `Assigns</api/language/assigns>` text As `String</api/data_types/string>`           |         |        |
| `PopUp<webmenuitem.popup>`                       |                                                                                                                                  |         |        |
| `PopUp<webmenuitem.popup2>`                      | x As `Integer</api/data_types/integer>`, y As `Integer</api/data_types/integer>`                                                 |         |        |
| `RemoveMenuItemAt<webmenuitem.removemenuitemat>` | index As `Integer</api/data_types/integer>`                                                                                      |         |        |

## Enumerations

<div id="webmenuitem.positions">

<div class="rst-class">

forsearch

</div>

</div>

WebMenuItem.Positions

### Positions

> The various positions in which the contextual menu will be displayed relative to the control to which is is attached.
>
> | Enum    | Description                                                                                                                                                                  |
> |---------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
> | Default | Always on the side to which the user's OS writing direction is set. If left to right, the menu will appear on the left. If right to left, the menu will appear on the right. |
> | Left    | Always to the left of the control.                                                                                                                                           |
> | Right   | Always to the right of the control.                                                                                                                                          |

<div id="webmenuitem.styles">

<div class="rst-class">

forsearch

</div>

</div>

WebMenuItem.Styles

### Styles

> Specifies the style of menu item (header, menuitem or separator).
>
> | Enum      | Description                                                   |
> |-----------|---------------------------------------------------------------|
> | Header    | The item text of the menu item appears but is not selectable. |
> | Menu      | A regular menu item.                                          |
> | Separator | A line that separates two other menu items.                   |

## Property descriptions

<div id="webmenuitem.count">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Count

**Count** As `Integer</api/data_types/integer>`

> The number of children for the menu item.
>
> This property is read-only.

<div id="webmenuitem.enabled">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Enabled

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

> If `True</api/language/true>`, the menu item is enabled.
>
> Add a contextual menu to a Label with one of the menu items disabled. This code is in the Shown event handler of a `WebLabel</api/user_interface/web/weblabel>`:
>
> ``` xojo
> Var base As New WebMenuItem
>
> Var loadMenu As New WebMenuItem("Load")
> base.Append(loadMenu)
>
> Var saveMenu As New WebMenuItem("Save")
> saveMenu.Enabled = False
> base.Append(saveMenu)
>
> Me.ContextualMenu = base
> ```

<div id="webmenuitem.icon">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Icon

**Icon** As `WebPicture</api/graphics/webpicture>`

> A picture that is assigned to the <span class="title-ref">WebMenuItem</span>.
>
> The following code is in the `Opening<webcontrol.opening>` event of a `WebPage</api/user_interface/web/webpage>`. The icon appears to the left of the menu item's text.
>
> ``` xojo
> hobbitsMenu.Icon = Frodo
> ```

<div id="webmenuitem.lastaddedindex">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.LastAddedIndex

**LastAddedIndex** As `Integer</api/data_types/integer>`

> The index of the last menu item added to the <span class="title-ref">WebMenuItem</span>.
>
> This property is read-only.

<div id="webmenuitem.position">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Position

**Position** As `Positions<webmenuitem.positions>`

> The position of the <span class="title-ref">WebMenuItem</span> relative to the control to which it is attached.

<div id="webmenuitem.style">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Style

**Style** As `Styles<webmenuitem.styles>`

> The style or type of the menu item.
>
> The options are Header, Menu and Separator.
>
> Create a new menu item and set it to be a header:
>
> ``` xojo
> Var m As New WebMenuItem
> m.Text = "Customers"
> m.Style = WebMenuItem.Styles.Header
> ```

<div id="webmenuitem.tag">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Tag

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

> A hidden value associated with the menu item.
>
> The tag is accessible via code when the user chooses the menu item but, unlike the Text property, is not displayed in the menu. It works like the RowTag property of a `PopupMenu</api/user_interface/web/webpopupmenu>` control.
>
> The Tag is a variant so it can contain any value, including class references.
>
> This code displays a menu when you right-click on a Label. This code is in the Shown event handler of a `WebLabel</api/user_interface/web/weblabel>`:
>
> ``` xojo
> Var file As New WebFile
> file.MimeType = "text/plain"
> file.ForceDownload = True ' If False, the browser may try to display the file instead of download it
> file.FileName = "TextFile.txt"
> file.Data = "Hello, world!"
>
> Var base As New WebMenuItem
>
> Var downloadMenu As New WebMenuItem("Download")
> downloadMenu.Tag = file ' The file to download
> base.AddMenuItem(downloadMenu)
>
> Me.ContextualMenu = base
> ```
>
> In the ContextualMenuAction event handler of the `WebLabel</api/user_interface/web/weblabel>`, you can then use the tag to download the previously created file:
>
> ``` xojo
> If Item.Text = "Download" Then
>   Var file As WebFile = Item.Tag
>   System.GotoURL(file.URL)
> End If
> ```

<div id="webmenuitem.text">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Text

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

> The text displayed.
>
> Set the text of the menu item to "Hobbiton":
>
> ``` xojo
> myMenu.Text = "Hobbiton"
> ```

<div id="webmenuitem.textcolor">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.TextColor

**TextColor** As `ColorGroup</api/graphics/colorgroup>`

> Gets or sets the color of the text of the <span class="title-ref">WebMenuItem</span>. The default value is black.
>
> The following example sets the TextColor.
>
> ``` xojo
> Me.TextColor = Color.Blue
> ```

## Method descriptions

<div id="webmenuitem.addmenuitem">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.AddMenuItem

**AddMenuItem**(text() As `String</api/data_types/string>`)

> Adds the rows in the array passed as menu items to the <span class="title-ref">WebMenuItem</span>.
>
> The value passed can also be a `ParamArray</api/language/paramarray>`.

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

**AddMenuItem**(item As <span class="title-ref">WebMenuItem</span>)

> Adds the item passed to the <span class="title-ref">WebMenuItem</span>.

<div id="webmenuitem.addmenuitemat">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.AddMenuItemAt

**AddMenuItemAt**(index As `Integer</api/data_types/integer>`, text As `String</api/data_types/string>`)

> Adds the value passed as a new menu item with *text* at the *index* passed.

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

**AddMenuItemAt**(index As `Integer</api/data_types/integer>`, item As <span class="title-ref">WebMenuItem</span>)

> Adds the value passed as a new menu *item* at the *index* passed.

<div id="webmenuitem.addseparator">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.AddSeparator

**AddSeparator**

> Adds a separator to the menu item.
>
> Create a new web menu item and add a separator to it:
>
> ``` xojo
> Var m As New WebMenuItem
> m.AddSeparator
> ```

<div id="webmenuitem.addseparatorat">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.AddSeparatorAt

**AddSeparatorAt**(index As `Integer</api/data_types/integer>`)

> Adds a separator to the menu item at the *index* passed.
>
> Add a separator at index 12 of the editMenu object:
>
> ``` xojo
> editMenu.AddSeparatorAt(12)
> ```

<div id="webmenuitem.constructor">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.Constructor

**Constructor**(text As `String</api/data_types/string>` = "", tag as `Variant</api/data_types/variant>` = `Nil</api/language/nil>`)

> <div class="note">
>
> <div class="title">
>
> Note
>
> </div>
>
> `Constructors</api/language/constructor>` are special methods called when you create an object with the `New</api/language/new>` keyword and pass in the parameters above.
>
> </div>
>
> Creates a new <span class="title-ref">WebMenuItem</span> assigning the *text* parameter passed to the `Text<webmenuitem.text>` property and the optional *tag* to the `Tag<webmenuitem.tag>` property.

<div id="webmenuitem.menuitemat">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.MenuItemAt

**MenuItemAt**(index As `Integer</api/data_types/integer>`)

> Returns a <span class="title-ref">WebMenuItem</span> indicated by the *index* passed.
>
> If the passed *index* is out of range, an `OutOfBoundsException</api/exceptions/outofboundsexception>` is raised.

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

**MenuItemAt**(index As `Integer</api/data_types/integer>`, `Assigns</api/language/assigns>` item As <span class="title-ref">WebMenuItem</span>)

> Adds item as a <span class="title-ref">WebMenuItem</span> at the position indicated by *index*. *index* is zero-based.

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

**MenuItemAt**(index As `Integer</api/data_types/integer>`, `Assigns</api/language/assigns>` text As `String</api/data_types/string>`)

> Adds the value passed as a new <span class="title-ref">WebMenuItem</span> at the *index* passed, using the passed *text* parameter as the Text property.

<div id="webmenuitem.popup">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.PopUp

**PopUp**

> Displays the contextual menu at the mouse position.

<div id="webmenuitem.popup2">

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

</div>

**PopUp**(x As `Integer</api/data_types/integer>`, y As `Integer</api/data_types/integer>`)

> Displays the contextual menu at the coordinates passed.

<div id="webmenuitem.removemenuitemat">

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

</div>

<div class="rst-class">

forsearch

</div>

WebMenuItem.RemoveMenuItemAt

**RemoveMenuItemAt**(index As `Integer</api/data_types/integer>`)

> Removes the menu item at the *index* passed.

## Notes

You can display a contextual menu in a web app by assigning the <span class="title-ref">WebMenuItem</span> to the `ContextualMenu<webuicontrol.contextualmenu>` property. When the user right+clicks on the control the contextual menu is displayed.

## Sample code

To add a contextual menu to a Button, add a this code to the `Shown<webuicontrol.shown>` event handler:

``` xojo
Var menu As New WebMenuitem
menu.AddMenuItem("Frodo")
menu.AddMenuItem("Sam")
Me.ContextualMenu = menu
```

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

Right-click on the button to show the menu.

To determine which menu was selected, use this code in the `ContextualMenuSelected<webuicontrol.contextualmenuselected>` event handler:

``` xojo
Select Case Item.Text
Case "Frodo"
  MessageBox("You chose Frodo.")
Case "Sam"
  MessageBox("You chose Sam.")
End Select
```

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

This code create a nested menu:

``` xojo
Var myMenu As New WebMenuItem

Var menuItem1 As New WebMenuItem("Dark Wizards")
Var subMenuItem1 As New WebMenuItem("Sauron")
menuItem1.AddMenuItem(subMenuItem1)

myMenu.AddMenuitem(menuItem1)
Me.ContextualMenu = myMenu
```

## Compatibility

|                       |     |
|-----------------------|-----|
| **Project Types**     | Web |
| **Operating Systems** | All |

<div class="seealso">

`Object</api/data_types/additional_types/object>` parent class; `WebToolbar</api/user_interface/web/webtoolbar>` class; `Menus</topics/user_interface/web/menus>` topic

</div>