Edit this page

autoFitColumn

Applies the minimum possible width for the specified column, so that all text fits without wrapping.

Parameters

column Number |String |Object

The index of the column, or the field to which the columns is bound, or the column object obtained from the columns collection.

Example - autofit a column by index

<div id="treeList"></div>
<script>
  $("#treeList").kendoTreeList({
    resizable: true,
    columns: [
      { field: "Name" },
      { field: "Position" }
    ],
    dataSource: [
      { id: 1, Name: "Daryl Sweeney", Position: "CEO", parentId: null, expanded: true },
      { id: 2, Name: "Guy Wooten", Position: "Chief Technical Officer", parentId: 1 }
    ]
  });
  var treeList = $("#treeList").data("kendoTreeList");
  treeList.autoFitColumn(1);
</script>

Example - autofit a column by field

<div id="treeList"></div>
<script>
  $("#treeList").kendoTreeList({
    resizable: true,
    columns: [
      { field: "Name" },
      { field: "Position" }
    ],
    dataSource: [
      { id: 1, Name: "Daryl Sweeney", Position: "CEO", parentId: null, expanded: true },
      { id: 2, Name: "Guy Wooten", Position: "Chief Technical Officer", parentId: 1 }
    ]
  });
  var treeList = $("#treeList").data("kendoTreeList");
  treeList.autoFitColumn("Position");
</script>

Example - autofit a column by column object reference

<div id="treeList"></div>
<script>
  $("#treeList").kendoTreeList({
    resizable: true,
    columns: [
      { field: "Name" },
      { field: "Position" }
    ],
    dataSource: [
      { id: 1, Name: "Daryl Sweeney", Position: "CEO", parentId: null, expanded: true },
      { id: 2, Name: "Guy Wooten", Position: "Chief Technical Officer", parentId: 1 }
    ]
  });
  var treeList = $("#treeList").data("kendoTreeList");
  treeList.autoFitColumn(treeList.columns[1]);
</script>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy