How to specify the min-width/max-width of grid column?

[Michael]

For example:
The grid has 3 columns. Column 1 and column 2 should have a max-width while column 3 should have a min width.
What i aim for ist the following:
On resizing (to max) the Browser, Column 1 and 2 should expand to a set width, while Column 3 should have the remaining space.
This can be done by setting the width of column 1 and 2 without setting the width of column 3.
But on resizing from a large to small, the column 3 shrinks until its gone. A div width min-width, does not help. Some styles of
the grid prevents this default table behaviour, which i can't figure out.
Column 3 should shrink to a set width and column 1 and 2 should shrink further.

How can i accomplish this behaviour.
Hiding a column is not an option.

Thanks

[Aleksandar]

Hello Michael,

I can suggest reviewing the third example in this knowledgebase article:

Apply Minimum Width during Column Resize

Basically, you can achieve the desired result by monitoring the width of the window and setting the column width using the setOptions method:

$(window).on("resize", function () {
        var minColumnWidth = 100;
        var grid = $("#grid").data("kendoGrid");
        var columns = grid.getOptions().columns;

        if ($(window).width() <= 716) { 
          columns[2].width = minColumnWidth; 
          grid.setOptions({
            columns: columns
          });
        }
        else {
          columns[2].width = "";
          grid.setOptions({
            columns: columns
          })
        };
      });

Regards,
Aleksandar
Progress Telerik

[Michael]

Thanks,

this works fine.

To prevent the grid from reading while resizing, (the setOptions function triggers read)

i set the autobind option to false and hat do refresh the grid on 'resize'.