这是一个带有示例剑道网格的 jsfiddle:
http://jsfiddle.net/owlstack/Sbb5Z/1619/
这是我设置剑道列的地方:
$(document).ready(function () {
var grid = $("#grid").kendoGrid({
dataSource: {
data: createRandomData(10),
schema: {
model: {
fields: {
FirstName: {
type: "string"
},
LastName: {
type: "string"
},
City: {
type: "string"
},
Title: {
type: "string"
},
BirthDate: {
type: "date"
},
Age: {
type: "number"
}
}
}
},
pageSize: 10
},
height: 500,
scrollable: true,
sortable: true,
selectable: true,
change: onChangeSelection,
filterable: true,
pageable: true,
columns: [{
field: "FirstName",
title: "First Name",
width: "100px",
}, {
field: "LastName",
title: "Last Name",
width: "100px",
}, {
field: "City",
width: "100px",
}, {
field: "Title",
width: "105px"
}, {
field: "BirthDate",
title: "Birth Date",
template: '#= kendo.toString(BirthDate,"MM/dd/yyyy") #',
width: "90px"
}, {
field: "Age",
width: "50px"
}]
}).data("kendoGrid");
applyTooltip();
});
我为每一列添加了单独的宽度。但是,我还想为每个剑道网格列设置一个最大宽度。是否可以设置最大宽度(不是为所有列设置一个,而是为单个列设置最大宽度?)?
最佳答案
剑道网格没有像 max-width 这样的属性。关于解决方案的一轮是将列的宽度设置为自动调整大小,然后在使用 css 属性保持最大宽度的地方使用模板。
例子如下。不确定您是否正在寻找相同的答案。
<style>.intro { max-width: 100px ;width: 20px ;background-color: yellow;</style>
<script>
$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
},
pageSize: 20
},
height: 550,
groupable: true,
sortable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
columns: [{
field: "ContactName",
title: "Contact Name",
template : '<span class=intro>#:ContactName#</span>'
}, {
field: "ContactTitle",
title: "Contact Title"
}, {
field: "CompanyName",
title: "Company Name"
}, {
field: "Country",
width: 150
}]
});
});
</script>
关于javascript - 如何为单个剑道网格列设置最大宽度属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28438632/