jquery - Kendo UI fixed width column size get increase on resizeing the grid -
i set first column fixed width '31px', when column make small size , resize grid resizeing container, first column increase. in feddle example if make title , age column size small in screen shot , resize see first column width increase.
var ds = new kendo.data.datasource({ data: createrandomdata(50), schema: { model: { fields: { firstname: { type: "string" }, lastname: { type: "string" }, city: { type: "string" }, title: { type: "string" }, age: { type: "number" } } } }, pagesize: 10 }); $(document).ready(function() { $("#grid").kendogrid({ datasource: ds, height: 450, sortable: true, reorderable: true, resizable: true, pageable: true, columnresize : savewidthofcolumns, rowtemplate: kendo.template($("#template").html()), columns: json.parse('[{"title":"firstname","width":"31px"},{"title":"title","width":null},{"title":"age","width":null}]') }); }); function savewidthofcolumns(event) { if (event.column.field == null) { $("#grid colgroup").each(function() { $(this).find(":nth-child(1)").css("width", "31px"); }); } } $(window).resize(function() { resizegrid(); }); function resizegrid() { var newwidth = $('body').innerwidth() - 20; var oldwidth = $(".k-grid-content table").width() - 20; if(oldwidth < newwidth) { $(".k-grid-content").css("padding-right", "18px"); $(".k-grid-content table").css("width",newwidth + "px"); $(".k-grid-header-wrap table").css("width",newwidth + "px"); } }
i'm not sure understand you're asking, try removing width style container div , grid fill , resize appropriately.
Comments
Post a Comment