javascript - Kendo UI Scheduler 未正确绑定(bind)资源

标签 javascript json kendo-ui telerik

我在尝试正确填充我的 KendoUI Scheduler 资源时遇到问题。我还没有找到如何将嵌套 JSON 对象(在本例中为屏幕截图中列出的任务和用户)绑定(bind)到获取的资源的好示例。

此外,在运行 Fiddler 时,似乎下面列出的资源甚至没有从 Web 服务中获取。该文档对某些细节非常不清楚,我很难找到问题所在。

时间表实际上会拉回所有 SchedulerEvents(下面获取的 JSON)并向我显示正确绑定(bind)到时间表的事件,只是它们没有附加资源。现在,我的所有 Web 服务调用都在 localhost 上运行,因此还不需要 JSONP,因为我的服务调用都在调用“localhost”。

我确实发现了与我尝试对数据投影所做的类似的事情here通过 Telerik 的文档,但我还没有找到一个好的解决方案。

已编辑:使用单独的数据源代码更新了我的问题

编辑2:我还应该提到,自从发布此内容以来,JSON 屏幕截图不再完全准确,因为我已经获取了 ScheduledTaskIdUserId (我试图添加到约会中的任务和用户资源的两个标识属性),并让该属性直接从我的 SchedulerEvent 类中可用,以避免嵌套对象。

Javascript

//Datasources code has been moved to here. Explicitly fetching data and assigning to Resources datasource properties

$("#scheduler").kendoScheduler({
    date: new Date("@DateTime.Now.ToShortDateString()"),
    timezone: "Etc/UTC",
    views: [
        "day",
        { type: "week", selected: true },
        "month",
        "agenda"
    ],
    dataSource: {

        batch: true,

        transport: {
            read: {
                url: "ServiceURI/Schedule/Get",
                dataType: "json"
            },
            update: {
                url: "",
                dataType: "json"
            },
            create: {
                url: "",
                dataType: "json"
            },
            destroy: {
                url: "",
                dataType: "json"
            },
            parameterMap: function (options, operation) {
                if (operation !== "read" && options.models) {
                    return { models: kendo.stringify(options.models) };
                }
            }
        },

        resources: [
            {
                field: "userId",
                title: "User",
                dataTextField: "displayName",
                dataValueField: "userId",
                dataSource: userDataSource
            }
            {
                field: "scheduledTaskId",
                title: "Task",
                dataTextField: "taskName",
                dataValueField: "scheduledTaskId",
                dataSource: taskDataSource
            }
        ],
        schema: {

            model: {
                id: "shiftId",
                fields: {
                    shiftId: {
                        from: "ShiftId",
                        type: "number"
                    },
                    title: {
                        from: "Title",
                        validation: { required: true } 
                    },
                    start: {
                        from: "Start",
                        type: "date",
                        validation: { required: true } 
                    },
                    end: {
                        from: "End",
                        type: "date",
                        validation: { required: true }
                    },
                    scheduledTaskId: {
                        from: "ScheduledTaskId",
                        type: "number"
                    },
                    userId: {
                        from: "UserId",
                        type: "number"
                    },
                    description: { 
                        from: "Description"
                    },
                    recurrenceId: { from: "RecurrenceID" },
                    recurrenceRule: { from: "RecurrenceRule" },
                    recurrenceException: { from: "RecurrenceException" },
                    isAllDay: { type: "boolean", from: "IsAllDay" } 
                }
            }
        }
    }
});

数据源

var userDataSource = new kendo.data.DataSource({
    transport: {
        read: {
            //This should be a customized list of users, or all users fetched from the datastore
            url: "ServiceURI/UserProfile/Get/",
            dataType: "json"
        },
    },
    schema: {
        model: {
            id: "userId",
            fields: {
                userId: {
                    from: "UserId",
                    type: "number"
                },
                displayName: {
                    from: "DisplayName"
                }
            }
        }
    }
});
userDataSource.fetch();

var taskDataSource = new kendo.data.DataSource({

    transport: {
        read: {
            //This should be the entire list of tasks fetched from the datastore
            url: "ServiceURI/ScheduledTask/Get?companyId=1",
            dataType: "json"
        }
    },
    schema: {
        model: {
            id: "scheduledTaskId",
            fields: {
                scheduledTaskId: {
                    from: "ScheduledTaskId",
                    type: "number"
                },
                taskName: {
                    from: "TaskName"
                }
            }
        }
    }

});
taskDataSource.fetch();

返回 JSON

JSON

最佳答案

问题

资源对象位于 dataSource 对象内部,因为我认为它应该是根据文档的

views: [
    "day",
    { type: "week", selected: true },
    "month",
    "agenda"
],
dataSource: {
    resources: [
        {
            field: "userId",
            title: "User",
            dataTextField: "displayName",
            dataValueField: "userId",
            dataSource: userDataSource
        }
        {
            field: "scheduledTaskId",
            title: "Task",
            dataTextField: "taskName",
            dataValueField: "scheduledTaskId",
            dataSource: taskDataSource
        }
    ]
}

回答

只需将资源数组移到数据源之外...即可按预期工作,无需任何显式 .fetch() 语句

views: [
    "day",
    { type: "week", selected: true },
    "month",
    "agenda"
],
resources: [
    {
        field: "userId",
        title: "User",
        dataTextField: "displayName",
        dataValueField: "userId",
        dataSource: userDataSource
    }
    {
        field: "scheduledTaskId",
        title: "Task",
        dataTextField: "taskName",
        dataValueField: "scheduledTaskId",
        dataSource: taskDataSource
    }
],
dataSource: { 

}

关于javascript - Kendo UI Scheduler 未正确绑定(bind)资源,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24739079/

相关文章:

javascript - 列表关闭并显示

JavaScript 代码不断重复语句。我怎样才能阻止这个?

kendo-ui - Kendo TreeView 按需加载未命中服务器

php - 没有反斜杠的 Laravel JSON 响应

asp.net-mvc-4 - 使用 Kendo UI 对 MVC4 中的 Controller 操作进行单元测试

javascript - 剑道网格 : populating with data from ajax

多行的 JavaScript 数组

javascript - Three.js - 为什么 csg.js 不工作?

ios - 服务器拉取后 JSON 或 NSDATA 不完整/被截断

c# - 使用 JSON.net 反序列化为对象时从时间戳中丢失毫秒数