# Adding a Context Menu

Learn how you can display a Spread context menu when right-clicking on the Spread control. Also, learn how to add menu items and set other properties for it.

## Content

You can display a Spread context menu when right-clicking on the Spread control. The context menu can be displayed when the user right-clicks on the column header, row header, or viewport area (data area and empty area).
You can add menu items to the menu and set the height or other properties. Specify the type of menu with the [ContextMenuType](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.ContextMenuType.html) enumeration. You can create a menu using markup code, the [ContextMenus](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.FpSpread.ContextMenus.html) property in the **Properties** window, or server code.
The [CommandArgument](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.MenuItem.CommandArgument.html) and [CommandName](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.MenuItem.CommandName.html) properties are used to separate which menu item is clicked in code. So in the [MenuItemClicked](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.FpSpread.MenuItemClicked.html) event on the server side you could add code such as switch(eventArgs.SelectedItem.CommandName) or switch(eventArgs.SelectedItem.CommandArgument).
![Spread Context Menu](https://cdn.mescius.io/document-site-files/images/346c9178-0ed8-4fb9-908b-1565b22fb408/artwork/contextmenu.png)

## Using the Properties Window

1. In the **Properties** windows select **Spread**.
2. Under the **Behavior** section select the **ContextMenus** property.
3. Use the **ContextMenu Collection** editor to add menus, menu items, and set any menu properties.
4. Click **OK** when finished.

## Using Code

1. Create a viewport menu using markup or the [ContextMenus](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.FpSpread.ContextMenus.html) property in the property window at design time.
2. Set the [EnableContextMenu](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.FpSpread.EnableContextMenu.html) property to true.
3. Create a row header menu with code.

## Example

This example code creates one menu at design time and one menu at run time.

```xml
<ContextMenus>
  <FarPoint:ContextMenu Type="Viewport">
    <Items>
      <FarPoint:MenuItem Enabled="True" ImageUrl="http://linktoimagehere/abc.jpc" Text="Menu item 1">
        <ItemTemplate>
          <asp:TextBox ID="bac" runat="server" />
        </ItemTemplate>
      </FarPoint:MenuItem>
      <FarPoint:MenuItem Text="Sort" ImageUrl="http://linktoimagehere/abc.jpc">
        <ChildItems >
          <FarPoint:MenuItem  Text="Child Item1"  ImageUrl="http://avc/abc.jpc"></FarPoint:MenuItem>
          <FarPoint:MenuItem Text="Child Item2"></FarPoint:MenuItem>
        </ChildItems>
      </FarPoint:MenuItem>
      <FarPoint:MenuItem Enabled="True" ImageUrl="http://linktoimagehere/abc.jpc">Menu item 3</FarPoint:MenuItem>
    </Items>
  </FarPoint:ContextMenu>
</ContextMenus>
```

```csharp
protected void Page_Load(object sender, System.EventArgs e)
{
    if (this.IsPostBack) return;
    FpSpread1.EnableContextMenu = true;
    //Create this viewport menu using markup or the ContextMenus property in the property window
    FarPoint.Web.Spread.ContextMenu viewportMenu = FpSpread1.ContextMenus[FarPoint.Web.Spread.ContextMenuType.Viewport];
    FarPoint.Web.Spread.MenuItem customViewportItem = new FarPoint.Web.Spread.MenuItem("Viewport item 1");
    customViewportItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("Child item 1"));
    customViewportItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("Child item 2"));
    viewportMenu.Items.Add(customViewportItem);

    //This row header menu is created here (no markup or design properties)
    FarPoint.Web.Spread.ContextMenu rowHeaderContextMenu = new FarPoint.Web.Spread.ContextMenu();
    rowHeaderContextMenu.Type = FarPoint.Web.Spread.ContextMenuType.RowHeader;
    FarPoint.Web.Spread.MenuItem rowHeaderItem = new FarPoint.Web.Spread.MenuItem("RowHeader item 1");
    rowHeaderItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("Child item 1"));
    rowHeaderItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("Child item 2"));
    rowHeaderContextMenu.Items.Add(rowHeaderItem);
    FpSpread1.ContextMenus.Add(rowHeaderContextMenu);
}
```

```vbnet
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
    If (IsPostBack) Then
        Return
    End If
    FpSpread1.EnableContextMenu = True
    'Create this viewport menu using markup or the ContextMenus property in the property window
    Dim viewportMenu As FarPoint.Web.Spread.ContextMenu = FpSpread1.ContextMenus(FarPoint.Web.Spread.ContextMenuType.Viewport)
    Dim customViewportItem As New FarPoint.Web.Spread.MenuItem("Viewport item 1")
    customViewportItem.ChildItems.Add(New FarPoint.Web.Spread.MenuItem("Child item 1"))
    customViewportItem.ChildItems.Add(New FarPoint.Web.Spread.MenuItem("Child item 2"))
    viewportMenu.Items.Add(customViewportItem)

    'This row header menu is created here (no markup or design properties) 
    Dim rowHeaderContextMenu As New FarPoint.Web.Spread.ContextMenu()
    rowHeaderContextMenu.Type = FarPoint.Web.Spread.ContextMenuType.RowHeader
    Dim rowHeaderItem As New FarPoint.Web.Spread.MenuItem("RowHeader item 1")
    rowHeaderItem.ChildItems.Add(New FarPoint.Web.Spread.MenuItem("Child item 1"))
    rowHeaderItem.ChildItems.Add(New FarPoint.Web.Spread.MenuItem("Child item 2"))
    rowHeaderContextMenu.Items.Add(rowHeaderItem)
    FpSpread1.ContextMenus.Add(rowHeaderContextMenu)
End Sub
```

## See Also

[Type Property](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.ContextMenu.Type.html)
[MenuItem Class](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.MenuItem.html)
[ContextMenu Collection Editor](/spreadnet/docs/latest/online-asp/overview/spweb-devguide/spweb-spdesigner/spweb-SDInterface/spweb-SDCollEditors/spweb-sdeditors-menuitem)
[ContextMenuStyle Class](/spreadnet/api/latest/online-asp/FarPoint.Web.Spread/FarPoint.Web.Spread.ContextMenuStyle.html)