Accordionitem inherits from view and is an integral part of the ui-related accordion component. You need at least two accordionitems to make a workable accordion.
Any accordionitem must have two properties: header for heading and body for main text or some ui component.
webix.ui({
rows:[ // or cols
{
view:"accordionitem",
header:"Pane 1",
headerHeight:20,
headerAlt:"Pane 2 Closed",
body:{ view:"form", ...} //ui component
},
{
view:"accordionitem",
header:"Pane ",
headerAlt:"Pane 2 Closed",
body:"This is Pane 2 body", //just text
collapsed: true
}]
})
If you initialize accordion like below, you can omit accordioitem initilization:
webix.ui({
view:"accordion",
rows:[
{header:"Pane", body:"Pane 1"},
{...}
});
Accordionitems can be collapsed and expanded prograsmmatically with the help of dedicated methods:
$$('item1').collapse();
$$('item1').expand();
//don't forget to specidy IDs to accordionitems!
If the items of your accordion are arranged in cols, their headers are collapsed to vertical panels as you close an accordionitem.