在自定义对象上过滤剑道网格 [英] Filtering a Kendo Grid on a custom object

问题描述

我有一个使用自定义对象的显示模板的 Kendo Grid.我已经实现了 IComparable 以允许分组和排序，但我不确定我需要做什么才能使过滤工作.实际上，当我单击该列的过滤器"按钮时，它有一个空白下拉列表，而不是通常会显示的包含、开头、等于"和此类选项.我正在使用 ToDataSourceResult 来操作结果.

I have a Kendo Grid with a display template that is using a custom object. I've implemented IComparable to allow grouping and sorting, but I'm not sure what I need to do to get the filtering to work. As it is, when I click the Filter button for the column it has a blank dropdown instead of the usual 'Contains, starts with, equals' and such options that would normally show. I am using the ToDataSourceResult to manipulate the results.

模型:

public class LEAProgramMap
{
    public string entity_program { get; set; }
    [UIHint("ProgramEditor")]
    public ProgramDDL program_desc { get; set; }
}

下拉菜单:

public class ProgramDDL : IComparable
{
    public short program_id { get; set; }
    public string entity_program { get; set; }
    public string program_desc { get; set; }
    public int CompareTo(object obj)
    {
        if (obj is ProgramDDL)
        {
            ProgramDDL rev2 = (ProgramDDL)obj;
            return program_desc.CompareTo(rev2.program_desc);
        }
        else
            throw new ArgumentException("Object is not a ProgramDDL");
    }
}

和视图:

@model IEnumerable<Datamart.Models.ViewModels.LEAProgramMap>

@{
    ViewBag.Title = "CreateProgramMap";
    var snapshot = Session["snapshot_id"] ?? Request.Params["snapshot_id"];
}

<h2>CreateProgramMap</h2>
@(Html.Kendo().Grid(Model)
.Name("Programs")
.Columns(cols =>
    {
        cols.Bound(p => p.entity_program).ClientTemplate("#=entity_program#");
        cols.Bound(p => p.program_desc).ClientTemplate("#=program_desc.program_desc#");
    })
.ToolBar(commands =>
    {
        commands.Save();
    })
.Editable(edit => edit.Enabled(true).Mode(GridEditMode.InCell))
.DataSource(ds => ds
            .Ajax()
            .Model(model =>
                {
                    model.Id(p => p.entity_program);
                    model.Field(p => p.entity_program).Editable(false);

                })
    // Configure RU -->
                .Read(read => read.Action("Program_Read", "Draft").Data("additionalData"))
                .Update(update => update.Action("Program_Update", "Draft").Data("additionalData"))
    //.ServerOperation(false)
                .Batch(true)
                .Events(events => events
                    //.Change("onChange")
                    .Error("onError")
                    )
                )
        // <-- Configure RU
        .Pageable(page => page.PageSizes(new int[] { 10, 25, 50, 100 }).Enabled(true))
        .Groupable(group => group.Enabled(true))
        .Filterable(filter => filter.Enabled(true).Extra(true))
        .Sortable(sort => sort.Enabled(true).SortMode(GridSortMode.SingleColumn).AllowUnsort(true))
        .Navigatable(nav => nav.Enabled(true))
        .Resizable(resizing => resizing.Columns(true))
        .Reorderable(reorder => reorder.Columns(true))
            )

<script>
function additionalData() {
    return {
        snapshot_id: "@snapshot"
    };
}

function onError(e, status) {
    if (e.errors) {
        var message = "The following errors have occurred:
";

        $.each(e.errors, function (key, value) {
            if (value.errors) {
                message += value.errors.join("
");
            }
        });

        alert(message);
    }
}

function onChange() {
    var grid = $("#Programs").data("kendoGrid");

    grid.dataSource.read();
}
</script>

推荐答案

不幸的是，Kendo UI 不支持包含复杂对象的类组合/视图模型，您的视图模型需要完全平坦以避免意外行为.所以你的类应该是这样的.

Unfortunately Kendo UI doesn't support Class Composition / View Models containing complex objects, your View Models need to be completely flat to avoid unexpected behaviour. So your class should look like this.

public class LEAProgramMap
{
    public string entity_program { get; set; }
    public short program_id { get; set; }
    public string entity_program { get; set; }
    public string program_desc { get; set; }
}

这篇关于在自定义对象上过滤剑道网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！