Advanced User Interface Controls and Components

IntegralUI Web

Documentation and API Reference


Occurs after an item is removed from the tree collection.

Event Data

eObjectAn event object which contains the item


This event can be handled by binding the 'itemremoved' event to the Menu widget object.

Version Information

Supported in: v1.0.


An example explaining how to create a handle to the itemremoved event in Menu widget. Whenever the 'Remove Item' button is clicked the currently selected item will be removed from the Menu, after which console log will display a message stating that itemremoved event is fired.

$(document).ready(function() {

// Create an instance of Menu widget

var $bar = $('#menu').menu();


// Get the item that is currently selected in Menu

var getCurrentSelection = function(){

return $"option", "selectedItem");



// When 'Remove Item' button is clicked, it removes the currently selected item from the Menu

var remove = function(){

$"removeItem", getCurrentSelection());



// Create a handler to the itemremoved event


"itemremoved": function(e){

console.log("itemremoved event was fired for item: " + e.object.text);



<!DOCTYPE html>



<link rel="stylesheet" href="css/" />

<link rel="stylesheet" href="css/themes/theme-blue.css" />

<script type="text/javascript" src="external/jquery-1.9.1.min.js"></script>

<script type="text/javascript" src="external/jquery.ui.core.min.js"></script>

<script type="text/javascript" src="external/jquery.ui.widget.min.js"></script>

<script type="text/javascript" src="js/jquery.integralui.widget.min.js"></script>

<script type="text/javascript" src="js/"></script>



<button type="button" onclick="remove()" />Clear</button>

<div id="menu" class="widget">







<li ><span>MenuItem23</span></li>



<li ><span>MenuItem232</span>












<li ><span>MenuItem3</span></li>













width: 600px;

height: 0;



See Also