Kendo ui 剑道网格初始列大小

我正在尝试使我的初始列宽适合我的剑道网格。这快把我逼疯了

我的网格如下所示

<table class="MyTableClass">
    <thead>
        <tr>
            <th>
                @(Html.Kendo().Grid(Model.MyModel).Name("myGrid").HtmlAttributes(new { @class = "shadow", style = "height:40%;width:100%" })
                    .Extra(false)
                    .Operators(...)
                    .Resizable(resize => resize.Columns(true))
                    .Sortable().Scrollable().Pageable().Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
                    .DataSource(dataSource => dataSource.Ajax().ServerOperation(false).PageSize(25))
                    .Columns(columns =>
                        columns.Bound(p => p.Property1).Title("MyProperty1").ClientTemplate("...");
                        columns.Bound(p => p.Property2).Title("MyProperty2").ClientTemplate("...").Width(100);
                        columns.Bound(p => p.Property3).Title("MyProperty3").ClientTemplate("...");
                        columns.Bound(p => p.Property4).Title("MyProperty4").ClientTemplate("...").Width(100);

@（Html.Kendo（）.Grid（Model.MyModel）.Name（“myGrid”）.HtmlAttributes（新的{@class=“shadow”，style=“高度：40%；宽度：100%”）
.额外（错误）
.操作员（……）
.resize可调整大小（resize=>resize.Columns（true））
.Sortable（）.Scrollable（）.Pageable（）.Selectable（可选=>Selectable.Mode（GridSelectionMode.Single））
.DataSource（DataSource=>DataSource.Ajax（）.ServerOperation（false）.PageSize（25））
.列（列=>
columns.Bound（p=>p.Property1.Title（“MyProperty1”）.ClientTemplate（“…”）；
columns.Bound（p=>p.Property2）.Title（“MyProperty2”）.ClientTemplate（“…”）.Width（100）；
columns.Bound（p=>p.Property3）.Title（“MyProperty3”）.ClientTemplate（“…”）；
columns.Bound（p=>p.Property4）.Title（“MyProperty4”）.ClientTemplate（“…”）.Width（100）；

正如你所看到的，除了两列之外，我已经为所有列设置了宽度，我想占用其余的任何宽度。这非常有效，除非宽度很小，没有显式宽度设置的两列基本上是零宽度，因此似乎丢失了

我试图在列上设置最小宽度（没有明确的宽度），如果它小于100，则将宽度设置为100

我已经尝试了我能想到的一切，并在文档加载时接近调用以下命令

function setColumnMinimumWidths() {
    $("#myGrid colgroup col").each(function () {
        if ($(this).width() < 100) {
            $(this).css("width", "100px");
        }
    })
}

函数setColumnMinimumWidths（）{
$（“#myGrid colgroup col”）。每个（函数（）{
if（$（this）.width（）<100）{
$（this.css（“宽度”，“100px”）；
}
})
}

这可以做到这一点，但是在调整窗口大小之后，所有其他列现在都可以均匀地调整大小（忽略显式宽度）

---

任何剑道或javascript专家有什么想法吗？

如果你的网格中有一些列有固定的网格，而一些没有固定的网格，那么具有width属性的列将提供宽度，其余的列将占据被平均分割的位置

您可以做的最简单的事情是在css中设置网格的最小宽度：

#grid{
    min-width: 400px;
}

---

检查此示例：

如果网格中的某些列具有固定网格，而某些列不具有固定网格，则具有width属性的列将提供宽度，其余列将占据等分位置的其余部分

您可以做的最简单的事情是在css中设置网格的最小宽度：

#grid{
    min-width: 400px;
}

---

检查此示例：

我们可以谈论过于复杂的事情！这非常有效…感谢您花时间！如果您觉得这个答案很有帮助，您可以接受它或投票。我希望我可以接受，但我还没有足够的声誉点数。我们可以谈论过于复杂的事情！这非常有效…感谢您花时间！如果您发现了这一点回答“帮助”你可以接受它或投票支持它。我希望我可以，但我还没有足够的声望点数。