TreeView with Context Menu

The TreeView below has a custom context menu. Right-click the tree to see it:

Parent 1

Child 1.1

Child 1.2

Child 1.3

Parent 2

Child 2.1

Child 2.2

Parent 3

Child 3.1

// This file locates: "Scripts/Lesson/C1Nav/ContextMenus.js".
c1.documentReady(function () {
    var theMenu = wijmo.Control.getControl('#theMenu');
    theMenu.itemClicked.addHandler(function (s, e) {
        alert('thanks for selecting ' + s.selectedValue.Header);
    });
 
    var theTree = wijmo.Control.getControl('#theTree');
    theTree.itemsSource = getData();
 
    // attach context menu to tree
    theTree.hostElement.addEventListener('contextmenu', function (e) {
        e.preventDefault();
        theMenu.show(e);
    });
 
    // create some data
    function getData() {
        return [
            {
                header: 'Parent 1', items: [
                    { header: 'Child 1.1' },
                    { header: 'Child 1.2' },
                    { header: 'Child 1.3' }]
            },
            {
                header: 'Parent 2', items: [
                    { header: 'Child 2.1' },
                    { header: 'Child 2.2' }]
            },
            {
                header: 'Parent 3', items: [
                    { header: 'Child 3.1' }]
            }
        ];
    }
});

// This file locates: "Content/css/Lesson/C1Nav/ContextMenus.css".
/* default trees on this sample */
.demo-control .wj-treeview {
    font-size: 120%;
    margin-bottom: 8px;
    padding: 6px;
    background: #f0f0f0;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1NavController : Controller
    {
        // GET: ContextMenus
        public ActionResult ContextMenus()
        {
            return View();
        }
    }
}

<h1>
    @Html.Raw(Resources.C1Nav.ContextMenus_Title)
</h1>
<p>
    @Html.Raw(Resources.C1Nav.ContextMenus_Text1)
</p>
 
<!-- this is the tree -->
@Html.C1().TreeView().Id("theTree").DisplayMemberPath("header").ChildItemsPath("items")
 
<!-- this is the context menu -->
@(Html.C1().Menu().Id("theMenu")
    .CssStyle("display", "none")
    .MenuItems(items =>
    {
        items.Add().Header(Resources.C1Nav.ContextMenus_Text2);
        items.Add().Header(Resources.C1Nav.ContextMenus_Text3);
        items.AddSeparator();
        items.Add().Header(Resources.C1Nav.ContextMenus_Text4);
        items.Add().Header(Resources.C1Nav.ContextMenus_Text5);
    })
)