New to Kendo UI for jQuery? Start a free 30-day trial

Remove

events

Fires before an item is removed from the ListBox.

The function context of the event handler (available through the this keyword) that will be set to the widget instance.

remove

Event Data

e.items `Array`

The item elements that are to be removed.

e.dataItems `Array`

The data items that are to be removed.

To set after initialization

<select id="listBox"></select>
<script>
$("#listBox").kendoListBox({
    template: "<div>#: name#</div>",
    toolbar: {
        tools: ["remove"]
    },
    dataSource: {
        data: [
            { id: 1, name: "Jane Doe" },
            { id: 2, name: "John Doe" }
        ],
        schema: {
            model: {
                id: "id",
                fields: {
                    id: { type: "number" },
                    name: { type: "string" }
                }
            }
        }
    }
});
// get a reference to the list box
var listBox = $("#listBox").data("kendoListBox");
// bind to the remove event
listBox.bind("remove", function(e) {
// handle event
    alert(e.dataItems[0].name + " was removed from the list");
});
</script>

<select id="listBox"></select>
<script>
$("#listBox").kendoListBox({
    template: "<div>#: name#</div>",
    toolbar: {
        tools: ["remove"]
    },
    dataSource: {
        data: [
            { id: 1, name: "Jane Doe" },
            { id: 2, name: "John Doe" }
        ],
        schema: {
            model: {
                id: "id",
                fields: {
                    id: { type: "number" },
                    name: { type: "string" }
                }
            }
        }
    },
    remove: function(e) {
        //handle event
        alert(e.dataItems[0].name + " was removed from the list");
    }
});
</script>