【问题标题】:Filtering a Kendo Grid on a custom object在自定义对象上过滤剑道网格
【发布时间】:2012-11-21 01:13:02
【问题描述】:

我有一个带有使用自定义对象的显示模板的 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>

【问题讨论】:

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


    【解决方案1】:

    不幸的是,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; }
    }
    

    【讨论】:

    • 所以我可以将我当前的视图模型用于过滤之外的所有内容?我必须为此添加一个功能请求 - 这似乎很奇怪,因为我认为如果它是一个重要功能,我可以在自定义解析器中实现它们。如果客户认为它足够重要,我现在可能只是在网格之外添加一个搜索,然后在发布后返回查看更优雅的解决方案。
    • 当我第一次偶然发现 Kendo UI 视图模型必须完全平坦的事实时,当我尝试应用排序时,它似乎能够正确绑定模型以便显示数据。当您尝试对 DataSourceResult(过滤器、排序、分组等)执行任何操作时,它似乎会给出意想不到的结果。
    • 在实现 IComparable 之后,我能够在 Kendo 中对复杂的类进行排序。分组也有效 - 可能是因为我使用的是模板?
    • 嗯,这可能是一些事情,最可能的原因是您的模型是 IList,并且分组/排序是在内存中完成的,不需要转换为 SQL - 我正在工作与 IQueryable 的
    • 这是来自 Kendo 支持团队的回复:很抱歉,不支持对复杂对象进行过滤,并且您无法更改自动生成的内置过滤器菜单(ddl 不是当列绑定到复杂对象时填充选项)。我建议您创建一个外部小部件/输入来过滤数据源,就像在 [demos.kendoui.com/web/grid/toolbar-template.html](this demo) 中一样 - DropDownList 位于 ToolBar 中,例如,您可以将其放在页面上的其他位置,甚至放在 ColumnHeader 中网格列。
    猜你喜欢
    • 2023-03-19
    • 1970-01-01
    • 2014-07-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-10-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多