web-dev-qa-db-ja.com

剣道グリッド列を自動幅にする方法

グリッドの列幅を指定しない場合は、jQueryプラグインデータテーブルを使用しました。

現在、Kendo Gridで同じ機能が必要ですが、Gridラッパースタイルを固定し、すべての列にcol width cssを設定することを除いて、それを見つけることができません。

したがって、私の質問は、Kendoグリッド列（通常、多くのフィールドがあり、スクロール可能です）を自動幅または異なる長さにする方法です（各列の幅を手動で設定することは期待していません）。

ありがとう

kendo-grid
11
cui

列を定義するときに幅を設定する必要があります。幅を指定しない場合、コンテンツの自動幅が使用されます。 このDOCをご覧くださいhttp://docs.telerik.com/kendo-ui/api/web/grid#configuration- columns.width

columns: [
     { field: "name", width: "200px" },
     { field: "tel", width: "10%" }, // this will set width in % , good for responsive site
     { field: "age" } // this will auto set the width of the content 
   ],

剣道の幅を処理する方法がさらに必要な場合は、 http://docs.telerik.com/kendo-ui/getting-started/web/grid/walkthrough#column-widths を参照してください。

11
cwishva

Scrollableをfalseに設定すると、トリックが実行されます。

$('#grid').kendoGrid({
  dataSource: {
     data: data
  },
  scrollable: false,
  resizable: true
});
7
Hawkeyecoder23

angular with dataBoundでこの問題も解決しています：

データバウンドの剣道自動フィット列に関する私の問題

        <kendo-grid id="grid" options="mainGridOptions">
        </kendo-grid>



        dataBound: function(){
            var grid = $("#grid").data("kendoGrid");
            for (var i = 0; i < grid.columns.length; i++) {
                grid.autoFitColumn(i);
            }
        },
        dataSource: $scope.data,

あなたはjqueryでそれを行うことができます：

$('#grid').kendoGrid({
  dataSource: {
     data: data
  },dataBound: function(){
            var grid = $("#grid").data("kendoGrid");
            for (var i = 0; i < grid.columns.length; i++) {
                grid.autoFitColumn(i);
            }
        },
4
saber tabatabaee yazdi