如何预先select kendoScheduler 弹出窗口window 上的资源值?

How to pre-select the resource values on a kendoScheduler pop-up window?

关于我正在开发的一个专注于 Scheduler 小部件的项目,我想知道它可以实现以下功能:

screencast

使用当前的调度程序,我可以按预期使用 startDate 和 endDate 的值,但是,我无法看到带有资源值的弹出窗口 window,这意味着那,我必须在弹出窗口中额外单击 window 以选择我想要的值。

这是我的脚本中的代码片段:

        group: {
        resources: ["Colaboradores"],
        orientation: "vertical"
    },

    resources: [{
        field: "UtilizadorID",
        name: "Colaboradores",
        dataTextField: "Nome",
        dataValueField: "ID",
        dataSource: new kendo.data.DataSource({
                transport: {
                    read: {
                        url: './../Services/HCAnestesiaWeb-AnestesiaDomainService.svc/JSON/GetColaboradores'
                    }
                },
                schema: {
                    type: "json",
                    data: "GetColaboradoresResult.RootResults",
                    total: "GetColaboradoresResult.TotalCount"
                }
            }
        ),
        multiple: true,
        title: "nome"
    },
    {
        field: "TipoEstado",
        dataValueField: "TipoDeEstadoID",
        dataTextField: "descr",
        dataColorField: "Cor",
        /*dataStartDateField: "startHour",
        dataEndDateField: "endHour",*/
        dataSource: new kendo.data.DataSource({
            transport: {
                read: {
                    url: './../Services/HCAnestesiaWeb-AnestesiaDomainService.svc/JSON/GetTiposEstados'
                }
            },
            schema: {
                type: "json",
                data: "GetTiposEstadosResult.RootResults",
                total: "GetTiposEstadosResult.TotalCount"
            }
        })
    }],

    // FRONT-END:
    edit: function(e) {

        var UtilizadorID = e.container.find("#selectColaborador").kendoMultiSelect({
            /*optionLabel: "Seleccionar...",*/
            dataTextField: "Nome",
            dataValueField: "ID"
        }).data("kendoMultiSelect");
        UtilizadorID.dataSource.data(e.sender.resources[0].dataSource.data());

        var utilizador = e.container.find("#selectColaborador").data("kendoMultiSelect");

        var TipoEstado = e.container.find("#selectEstado").kendoMultiSelect({
            /*optionLabel: "Seleccionar...",*/
            dataTextField: "descr",
            dataValueField: "TipoDeEstadoID",
            dataColorField: "Cor",
            template: '<div style="background-color: #:Cor#; border-radius: 10px; height: 30px; width: 30px; float: left"></div><div>#:descr#</div>'
        }).data("kendoMultiSelect");
        TipoEstado.dataSource.data(e.sender.resources[1].dataSource.data());

        // $("#dataInicio").val(e.event.start);
        // $("#dataFim").val(e.event.ID);
        // $("#data").val(e.event.UtilizadorID);
        console.log(e.event);
        /*var dataInicio = e.container.find("#dataInicio").data("kendoDropDownList");*/
        // dataInicio.dataSource.data(e.sender.resources[0].dataSource.data());

        /*var dataFim = e.container.find("#dataFim").data("kendoDropDownList");*/
        // dataFim.dataSource.data(e.sender.resources[0].dataSource.data());

    },

在编辑函数内的多选定义中,您可以像这样设置选定值:

var UtilizadorID = e.container.find("#selectColaborador").kendoMultiSelect({
            dataTextField: "Nome",
            dataValueField: "ID",
            value: ["1", "3"] // here you set the selected value(s)
        }).data("kendoMultiSelect");

您必须找到您需要的资源 ID 并将其放在那里。

这里是JSBin

已找到此问题的解决方案,下面是:

  • 由于我手动设置源,这意味着在小部件尝试设置其值期间它是空的。预计,它不会 select 任何东西,因为它是空的,然后,当设置源时,没有代码会重新应用该值;

  • 这种情况的解决方案是手动 select 值。基本上,在编辑事件中,由于正确填充了 e.event 实例,因此可以直接使用 e.event.UserID 值。

  • 我必须创建一个新变量并在获取 kendoMultiSelect 的所有数据源的行下方调用其值:

    var UtilizadorIDsender = e.event.UtilizadorID[0];

    var UtilizadorID = e.container.find("#selectColaborador").kendoMultiSelect({ 数据文本字段:"Nome", 数据值字段:"ID" }).data("kendoMultiSelect"); UtilizadorID.dataSource.data(e.sender.resources[0].dataSource.data()); $("#selectColaborador").getKendoMultiSelect().value(UtilizadorIDsender);