首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >KendoUI网格自动适合最小/最大宽度的列

KendoUI网格自动适合最小/最大宽度的列
EN

Stack Overflow用户
提问于 2020-01-20 13:26:10
回答 1查看 683关注 0票数 1

我使用autoFitColumns方法,如下所述:

https://www.telerik.com/kendo-angular-ui/components/grid/columns/resizing/#toc-auto-fitting-the-content

但在某些情况下,该方法会使列的大小过小(例如,当网格中只有1-2列时)或过大(当列包含长文本且不需要实际显示所有文本时)。

有没有办法在自动调整大小时设置最大/最小宽度?

EN

回答 1

Stack Overflow用户

发布于 2020-01-21 23:43:52

据我所知,这并没有内置到网格中;但是,您可以通过更新列选项来做到这一点:

代码语言:javascript
复制
var FitCols = function(){
  var grid = $("#grid").data("kendoGrid");
  if (grid) {
    //copy current column options from the grid
    var newOptions = $.extend({}, grid.getOptions().columns);               
    var minW = 80;  //minimum column width
    var maxW = 300; //maximum column width
    for (var i = 0; i < grid.columns.length; i++) {
      grid.autoFitColumn(i);
      //after autofit, limit to max and min width
      var curW = grid.columns[i].width;
      var actualW = Math.max(curW, minW); //min check
      actualW = Math.min(actualW, maxW); //max check
      newOptions[i].width = actualW + "px";
    }    
    grid.setOptions({ columns:  newOptions });
  }        
};  

此代码在自动调整大小之前从网格中获取列选项。然后迭代每一列,调用autosize,根据最大值和最小值检查新的大小,将新的大小写入复制的列选项,最后将这些选项写回网格。

下面是一个dojo演示:http://dojo.telerik.com/@ezanker/EFiVoNiP

请记住,如果您有许多列,自动调整大小将以指数级变慢...

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59817408

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档