SyncFusion ejTreeGrid-删除滚动条 [英] SyncFusion ejTreeGrid - remove scrollbar

问题描述

我应该怎么做?看来它使用了 ejScroller ，因为我在其中使用< ej-scroller> 创建的html具有相同的元素，并且使用了这样的元素:

How should I do it? It seems it uses ejScroller because where I use <ej-scroller> html being created the same, with such element:

<div class="e-scrollbar e-js e-widget e-vscrollbar" style="height: 622px; width: 18px;">

推荐答案

Syncfusion TreeGrid具有自动"高度支持，用户可以使用它来显示TreeGrid中的所有记录而无需垂直滚动条.在这种情况下，如果TreeGrid高度超过浏览器查看端口，将显示浏览器滚动条，这可以通过设置 sizeSettings.height 属性设置为自动.请参考以下代码段.

The Syncfusion TreeGrid has "auto" height support using which user can display all the records in TreeGrid without vertical scrollbar. In this case, the browser scrollbar will appear if the TreeGrid height exceeds the browser view port and this can be achieved by setting sizeSettings.height property as auto. Please refer the below code snippet.

   <ej-treegrid id="TreeGridContainer" [dataSource]="treeGridData"
    sizeSettings.height="auto"
    //…
    </ej-treegrid>

通过使用创建，我们还可以显示没有滚动条且具有固定高度的TreeGrid.，崩溃，

We can also display TreeGrid without scrollbar and with a fixed height by using create, collapsed, expanded, actionComplete client side events with some work around. Please refer the below code snippet.

[HTML]
<ej-treegrid id="TreeGridContainer" [dataSource]="treeGridData" 
(create)="create($event)" (collapsed)="collapsed($event)" (expanded)="expanded($event)" (rowSelected)="rowSelected($event)" (actionComplete)="actionComplete($event)"
//..
</ej-treegrid>

[TS]
  create(args) {
        /To update the height of TreeGrid during load time
         this.updateTreeHeight();
    }

    collapsed(args) {
       //To update the height of TreeGrid during collapse action
        this.updateTreeHeight();
    }

    expanded(args) {
       //To update the height of TreeGrid during expand action
       this.updateTreeHeight();
    }

    rowSelected(args) {
        //To update the height of TreeGrid while adding any row
         this.updateTreeHeight();
    }

    actionComplete(args) {
      //To update the height of TreeGrid while saving the newly added row and deleting the existing row
       if (args.requestType == "addNewRow" || args.requestType == "delete") {
            this.updateTreeHeight();
        }
    }
    updateTreeHeight=function() {
    var tree = $("#TreeGridContainer").ejTreeGrid("instance"),
        toolbar = $("#TreeGridContainer_toolbarItems").height(),
        model = tree.model,
        totalLen = tree.getExpandedRecords(model.updatedRecords);
    if (toolbar == undefined)
        toolbar = 0;
    //To calculate the height of TreeGrid as per records count
    var height = model.rowHeight * totalLen.length + tree.getHeaderContent().height() + toolbar + 4;
    //Update height using setModel
    var sizesettings = { height: height.toString() };
    tree.setModel({ "sizeSettings": sizesettings });
}

请在下面找到示例链接 http://www.syncfusion.com/downloads/support/directtrac/general/ze/TreeGrid_without_scrollbar-1219686615

Please find the sample link below http://www.syncfusion.com/downloads/support/directtrac/general/ze/TreeGrid_without_scrollbar-1219686615

此致

Punniyamoorthi

Punniyamoorthi

这篇关于SyncFusion ejTreeGrid-删除滚动条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！