在自定义对象上过滤Kendo网格

时间:2012-11-21 01:13:03

标签: asp.net-mvc-4 grouping kendo-ui

我有一个带有显示模板的Kendo Grid,它使用自定义对象。我已经实现了IComparable以允许分组和排序,但我不确定我需要做些什么来使过滤工作。实际上,当我单击列的“过滤器”按钮时,它有一个空白下拉列表而不是通常的“包含,以等于开头”和通常显示的这些选项。我使用 ToDataSourceResult 来操纵结果。

模特:

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:\n";

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

        alert(message);
    }
}

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

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

1 个答案:

答案 0 :(得分:2)

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

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; }
}