我有一个带有行过滤器的非常小的列的网格,这使得它们具有非常小的文本框。所以我用了
field: "OrderID",
width: 100,
filterable: {
cell: {
inputWidth: 65
}
}
但是当我定义inputWidth以放大文本字段时,过滤器操作符不会移动,实际上会覆盖文本框的部分空间。因此,我想知道是否有一种方法可以将过滤器操作符移动到或最好移到标题标题,如columnMenu过滤器图标。非常感谢任何帮助,谢谢。
我从以下示例中获取了以下示例:http://demos.telerik.com/kendo-ui/grid/filter-row
并修改了orderID的宽度和输入宽度
<div id="example">
<div id="grid"></div>
<script>
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read:"http://demos.telerik.com/kendo- ui/service/Northwind.svc/Orders"
},
schema: {
model: {
fields: {
OrderID: { type: "number" },
Freight: { type: "number" },
ShipName: { type: "string" },
OrderDate: { type: "date" },
ShipCity: { type: "string" }
}
}
},
pageSize: 20,
serverPaging: true,
serverFiltering: true,
},
height: 550,
filterable: {
mode: "row"
},
pageable: true,
columns:
[{
field: "OrderID",
width: 100,
filterable: {
cell: {
inputWidth: 65
}
}
},
{
field: "ShipName",
width: 500,
title: "Ship Name",
filterable: {
cell: {
operator: "contains"
}
}
},{
field: "Freight",
width: 255,
filterable: {
cell: {
operator: "gte"
}
}
},{
field: "OrderDate",
title: "Order Date",
format: "{0:MM/dd/yyyy}"
}]
});
});