在kendo中用自己的值填充列的过滤器值
问题描述:
我有一个kendo网格,它填充了一些JSON数据,在网格的过滤器窗口中填充 ,您可以选择一个条件类型,然后填写条件值文本框,然后根据您的选择过滤网格。在kendo中用自己的值填充列的过滤器值
现在我有一列只填充了四个或五个不同的值。 我想要使过滤器部分的条件值字段成为下拉列表,而不是写入这些值来选择它们,我想从列表中选择它们。 (我的意思是在网格列的过滤器部分,而不是列本身。)
我读an article这就像我想要的,但它已经在代码中添加了这些值, 我应该通知你那些字段每次都不相同,所以我无法通过硬编码将这些值写入过滤器。
甚至像this one这样的东西与我想要的非常相似(Filter Condition Created For'City'Field),但它使用不同的来源获取条件下拉值,而不是网格列本身。
另外,我不能使用JSON数据,我必须使用剑道网格中的信息。
在此先感谢。
答
我找到了解决我的最后一个问题......
网格绑定到数据源,由网格的数据源上设置一个循环后,我把网格中的一列的数据并将其推送到数组,然后将该列上的过滤器设置为数组。
<script type="text/javascript">
var arrayName = [];
$(function() {
var productsDataSource = new kendo.data.DataSource({
transport: {
read: {
url: "api/products",
dataType: "json",
contentType: 'application/json; charset=utf-8',
type: 'GET'
},
parameterMap: function (options) {
return kendo.stringify(options);
}
},
schema: {
data: "Data",
total: "Total",
model: {
fields: {
"Id": { type: "number" },
"Name": { type: "string" },
"IsAvailable": { type: "boolean" },
"Price": { type: "number" }
}
}
},
error: function (e) {
alert(e.errorThrown);
},
sort: { field: "Id", dir: "desc" },
serverPaging: true,
serverFiltering: true,
serverSorting: true
});
productsDataSource.read();
$("#report-grid").kendoGrid({
dataSource: productsDataSource,
dataBound:
function (e) {
var data = $("#report-grid").data("kendoGrid").dataSource._data;
for (i = 0; i < data.length; i++) {
arrayName.push(data[i].Name);
}
},
autoBind: false,
scrollable: false,
pageable: true,
sortable: true,
filterable: { extra: false },
reorderable: true,
columnMenu: true,
columns: [
{ field: "Id", title: "No", width: "130px" },
{ field: "Name", title: "ProductName", filterable: { ui: SystemFilter } },
{
field: "IsAvailable", title: "Available",
template: '<input type="checkbox" #= IsAvailable ? checked="checked" : "" # disabled="disabled" ></input>'
},
{ field: "Price", title: "Price", format: "{0:c}" }
]
});
function SystemFilter(element) {
element.kendoDropDownList({
dataSource: arrayName,
optionLabel: "--Select Name--"
})
};
});
答
我喜欢这样做的一种方法是创建我的值列表并将该列表添加到ViewData,然后将其传递给View。
public IEnumerable<ModelName> GetTypes()
{
//Get data from the table you store your values in.
return dbContext.TypesTable.OrderBy(f => f.Name);
}
public ActionResult YourView()
{
IEnumerable<ModelName> types = GetTypes();
ViewData["MyTypes"] = types;
return View();
}
然后在您的网格中添加一个ForeignKey
列并将其设置为看你之前设置的ViewData的。
@(Html.Kendo().Grid<ViewModelName>()
.Name("GridName")
.Columns(columns =>
{
columns.ForeignKey(c => c.RecipientType, (System.Collections.IEnumerable)ViewData["MyTypes"], "TypeId", "Name");
})
)
此列现在将显示您当前记录的值的名称。然后,当您编辑或添加记录时,此字段将显示为包含所有可能值的下拉菜单。
感谢您的回答,但我想添加一列的不同值到列的过滤器部分作为下拉列表,而不是在网格本身。 – eFarzad
我明白你现在要问什么。但是,这段代码仍然会做你想做的。过滤器将使用您在ViewData中提供的项目并显示为下拉菜单。 – Supersnake
好吧,我该如何用网格的一列数据填充ViewData? – eFarzad