Scrollbars do not show!

Site and Services
1

I have been struggling to get a Y scroll bar to show. We have several accordions with unitlist in them. We stack these accordions (rows) in a scrollview but no luck although the scrollview’s outer container is limited to the browser’s extents 100%. The expanded accordion and unitlist are larger than the outer container and extend beyond the visible screen but no scrollbar. Expanding an accordion tends to fill all available vertical space. Is the accordion causing the constraint? The accordion’s unitlist does extend beyond the accordion’s parent component’s extents bit no scrollbar. Please note, I have scroll : false on all unitlist since it would be very difficult for a user to scroll vertically when all the accordions are open since one accordion’s contents can extend beyond the users visible viewport, hence the need for scrolling.

{

  id      : "esqSearchPanel"
 ,hidden  : true
 ,margin  : 0
 ,padding : 4
 ,width  : "100%"
 ,height : "100%"
 ,type   : "clean"
 ,borderless : true   

 ,rows : [

    {  view : 'label'
     ,padding     : 0
     ,margin       : 0
     ,type           : "clean"
     ,borderless : true
     ,template    : 'Global Search'
     ,gravity       : 4
   }

   ,{
      cols : [

          {  id : "x1"
              ,margin  : 4
              ,padding : 0
              ,type      : 'clean'
              ,boderless : true

          ,view    : 'scrollview'  <--- DOES NOT WORK!
          ,scroll  : "y"

              ,body : {

                  rows : [ 
                       // omitted and abbreviated for clarity
                        //{ accordion with untlist }
                       //,{ accordion with untlist }
                       //,{ accordion with untlist }
                       //,{ accordion with untlist }
                  ]

              }

          }

      ], { // hidden form column omitted }

   }

 ]
2

please ignore , { // hidden form column omitted } it was placed in wrong location in message but is correct in actual code. Has no bearing on issue.

3

Ok since no one has a solution I will provide my own but I don’t think it should be necessary since an Accordion should size itself to its contents instead of filling its parent container when expanded. Having to call collapsed twice since adjust(), refresh() and resize() didn’t resize the accordion correctly.

EsqList.prototype.resizeUnitListAccordion = function( list, list_id ) {

if ( ! list ) return;

var accord = $$( list_id + '.tab' );

if ( accord ) {

    var hdrHt = 38 + 30 ; // accordion-hdrHgt + toolbarHgt

    if ( ! list.count() ) {

        list.config.height = hdrHt + 26;

    } else {

        var minHt = list.config.type.minHeight;

        if ( !minHt ) minHt = 26;

        list.config.height = hdrHt + ( list.getUnits().length * 20 ) + ( list.count() * minHt );

    }

    accord.define( "collapsed", !accord.config.collapsed );
    accord.define( "collapsed", !accord.config.collapsed );

}

};

4

Please create a demo via http://webix.com/snippet/ The snippet is not clear.

5

Issue resolved. The problem lies in the Accordions not resizing to their contents if placed in a scrollview. We created a recall fun that resizing the accordions correctly.

Thanks for the ping back though. BTW, we love this product.

6

reclac func