# wjContextMenu Class

## Content

<div class="content__tsd">
						<div style="display:flex;justify-content:space-between;align-items:center">
							<h1>
								wjContextMenu Class
							</h1>
						</div>
						<section class="tsd-comment">
							<div class="tsd-comment">
								<div class="lead">
									<p>KnockoutJS binding for context menus.</p>
								</div>
								<p>Use the <a href="wijmo_knockout_input.wjcontextmenu.html">wjContextMenu</a> binding to add context menus to elements
									on the page. The <a href="wijmo_knockout_input.wjcontextmenu.html">wjContextMenu</a> binding is based on the  <a href="wijmo_knockout_input.wjmenu.html">wjMenu</a>;
									it displays a popup menu when the user performs a context menu
								request on an element (usually a right-click).</p>
								<p>The wjContextMenu binding is specified as a parameter added to the
									element that the context menu applies to. The parameter value is a
								CSS selector for the element that contains the menu. For example:</p>
								<pre>&lt;!-- paragraph with a context menu --&gt;
&lt;p data-bind="wjContextMenu: { id: '#idMenu'}" &gt;
 This paragraph has a context menu.&lt;/p&gt;

&lt;!-- define the context menu (hidden and with an id) --&gt;
&lt;div id="contextmenu" data-bind="wjMenu: { header: 'File', itemClicked: menuItemClicked}"&gt;
    &lt;span data-bind="wjMenuItem: {}"&gt;New&lt;/span&gt;
    &lt;span data-bind="wjMenuItem: {}"&gt;open an existing file or folder&lt;/span&gt;
    &lt;span data-bind="wjMenuItem: {}"&gt;save the current file&lt;/span&gt;
    &lt;span data-bind="wjMenuSeparator: {}"&gt;&lt;/span&gt;
    &lt;span data-bind="wjMenuItem: {}"&gt;exit the application&lt;/span&gt;
&lt;/div&gt;</pre>
							</div>
						</section>
						<section class="tsd-hierarchy">
							<h3>Heirarchy</h3>
							<ul class="tsd-hierarchy">
								<li>
									<span class="tsd-signature-type">WjBinding</span>
									<ul class="tsd-hierarchy">
										<li>
											<span class="target">wjContextMenu</span>
										</li>
									</ul>
								</li>
							</ul>
						</section>
					</div>