Triggered when an item of a PanelBar is activated.

Attach activate event handler during initialization; detach via unbind()

// event handler for activate
var onActivate = function(e) {
    // access the activated item via e.item (HTMLElement)
};

// attach activate event handler during initialization
var panelBar = $("#panelBar").kendoPanelBar({
    activate: onActivate
});

// detach activate event handler via unbind()
panelBar.data("kendoPanelBar").unbind("activate", onActivate);

Attach activate event handler via bind(); detach via unbind()

// event handler for activate
var onActivate = function(e) {
    // access the activated item via e.item (HTMLElement)
};

// attach activate event handler via bind()
$("#panelBar").data("kendoPanelBar").bind("activate", onActivate);

// detach activate event handler via unbind()
$("#panelBar").data("kendoPanelBar").unbind("activate", onActivate);

Event data

item : Element: The activated item of the PanelBar.

Triggered when an item of a PanelBar is collapsed.

Attach collapse event handler during initialization; detach via unbind()

// event handler for collapse
var onCollapse = function(e) {
    // access the collapsed item via e.item (HTMLElement)
};

// attach collapse event handler during initialization
var panelBar = $("#panelBar").kendoPanelBar({
    collapse: onCollapse
});

// detach collapse event handler via unbind()
panelBar.data("kendoPanelBar").unbind("collapse", onCollapse);

Attach collapse event handler via bind(); detach via unbind()

// event handler for collapse
var onCollapse = function(e) {
    // access the collapsed item via e.item (HTMLElement)
};

// attach collapse event handler via bind()
$("#panelBar").data("kendoPanelBar").bind("collapse", onCollapse);

// detach collapse event handler via unbind()
$("#panelBar").data("kendoPanelBar").unbind("collapse", onCollapse);

Event data

item : Element: The collapsing item of the PanelBar.

Fires when content is fetched from an AJAX request.

Example

$("#panelBar").kendoPanelBar({
    contentLoad: function(e) {
        // handle event
    }
});

To set after intialization

// get a reference to the panel bar
var panelBar = $("#panelBar").data("kendoPanelBar");
// bind the contentLoad event
panelBar.bind("contentLoad", function(e) {
    // handle event
});

Event data

item : Element: The selected item
contentElement : Element: The loaded content element

Fires when AJAX request results in an error.

Example

$("#panelBar").kendoPanelBar({
    error: function(e) {
        // handle event
    }
});

To set after intialization

// get a reference to the panel bar
var panelBar = $("#panelBar").data("kendoPanelBar");
// bind the error ajax event
panelBar.bind("error", function(e) {
    // handle event
});

Event data

xhr : jqXHR: The jqXHR object used to load the content
status : String: The returned status.

Triggered when an item of a PanelBar is expanded.

Attach expand event handler during initialization; detach via unbind()

// event handler for expand
var onExpand = function(e) {
    // access the expanded item via e.item (HTMLElement)
};

// attach expand event handler during initialization
var panelBar = $("#panelBar").kendoPanelBar({
    expand: onExpand
});

// detach expand event handler via unbind()
panelBar.data("kendoPanelBar").unbind("expand", onExpand);

Attach expand event handler via bind(); detach via unbind()

// event handler for expand
var onExpand = function(e) {
    // access the expanded item via e.item (HTMLElement)
};

// attach expand event handler via bind()
$("#panelBar").data("kendoPanelBar").bind("expand", onExpand);

// detach expand event handler via unbind()
$("#panelBar").data("kendoPanelBar").unbind("expand", onExpand);

Event data

item : Element: The expanding item of the PanelBar.

Triggered when an item of a PanelBar is selected.

Attach select event handler during initialization; detach via unbind()

// event handler for select
var onSelect = function(e) {
    // access the selected item via e.item (HTMLElement)
};

// attach select event handler during initialization
var panelBar = $("#panelBar").kendoPanelBar({
    select: onSelect
});

// detach select event handler via unbind()
panelBar.data("kendoPanelBar").unbind("select", onSelect);

Attach select event handler via bind(); detach via unbind()

// event handler for select
var onSelect = function(e) {
    // access the selected item via e.item (HTMLElement)
};

// attach select event handler via bind()
$("#panelBar").data("kendoPanelBar").bind("select", onSelect);

// detach select event handler via unbind()
$("#panelBar").data("kendoPanelBar").unbind("select", onSelect);

Event data

item : Element: The selected item of the PanelBar.