Search code examples
javascripttemplatesheightaccordionwebix

Expanding one accordion item in the view


I have a form and onlu one accordion item within in (to show an additional information about other content). But seems like one accordion item don't want to collapse/expand properly. If I set collapsed:false, it cannot be collapsed at all. If collapsed:true, it can be expanded only once and then never collapsed.

I suspect the problem is in the filling a determined height, but I can't solve it by myself.

What have I done wrong?

Here's a short code preview:

view:"form",
elements:[    
    { height:300 },
    {
      view:"accordion",           
      rows:[                  
        {
          view:"accordionitem",           
          height:150,
          collapsed:true, 
          body:{
            template:""
          }                         
        }        
      ]
    },
    { autoheight:true }
]

Full snippet


Solution

  • By default, accordion ensure that at least one panel is always visible. You can add multi:true to the accordion's config, to disable this behavior.

      {
        view:"accordion", multi:true,            
        rows:[                  
          {
            height:150,
            collapsed:true,  
            header:"test",
            body:{
              template:""
            }                         
          }        
        ]
      },
    

    http://webix.com/snippet/cff77257