如何在Kendo Scheduler自定义模板中使用Dropbox?

时间:2014-03-02 21:33:23

标签: asp.net-mvc razor kendo-ui scheduler

我正在尝试在我的Kendo,MVC(razor)调度程序对象中使用自定义编辑模板。我可以在模板中生成简单的对象,但无法弄清楚如何添加Dropbox并使用控制器中的数据填充它。我已经看到了从服务提要驱动的下拉框示例,但我需要从控制器/演示服务中填充列表值。以下是我到目前为止的情况:

<div id="SchedulerDiv">        
    @(Html.Kendo().Scheduler<TestModel>()
        .Name("TestScheduler")
        .Date(new DateTime(2013, 6, 13))
        .StartTime(new DateTime(2013, 6, 13, 7, 00, 00))
        .Height(600)
         //.AllDayEventTemplateId("UpdateTemplate")
        .Editable(editable=>editable.TemplateId("UpdateTemplate"))
        .Views(views =>
            {
                views.DayView();
                views.WeekView();
                views.MonthView(monthView => monthView.Selected(true));
            })
        .Timezone("Etc/UTC")
        .Resources(resource =>
            {
                resource.Add(m => m.ReasonId)
                        .Title("Reason")
                        .DataTextField("Text")
                        .BindTo(new[] { 
                            new { Text = "It's Broken", Value = 1, Color = "#f8a398" } ,
                            new { Text = "Damaged", Value = 2, Color = "#51a0ed" } ,
                            new { Text = "Got Tired Of It", Value = 3, Color = "#56ca85" }
                        });

            })

        .DataSource(d => d
            .Read("Read", "Scheduler")
            .Create("Create", "Scheduler")
            .Destroy("Destroy", "Scheduler")
            .Update("Update", "Scheduler")

        )

    )

我的自定义脚本是:

<script id="UpdateTemplate" type="text/x-kendo-template">
<h3>Edit meeting</h3>
<p>
    <label>Title: <input name="title" /></label>
</p>
<p>
    <label>Start: <input data-role="datetimepicker" name="start" /></label>
</p>
<p>
    <label>Start: <input data-role="datetimepicker" name="end" /></label>
</p>

<p>
    <select id="myDropDown" type=... /> @*<==  I would like to data drive this from json data from a controller action*@
</p>

<p>
    <script>
        var dataSource = new kendo.data.DataSource({ transport: { read: { url: "http://demos.kendoui.com/service/products", dataType: "jsonp" } } }); 

        jQuery(function() { jQuery("\\#myDropDown").kendoDropDownList({ dataSource: dataSource, dataTextField: "ProductName", dataValueField: "ProductID" } ); });
    <\/script>

</p>

以上工作,但我想从控制器操作驱动rowsource,而不是服务调用。我该怎么做呢?谢谢!

史蒂芬

1 个答案:

答案 0 :(得分:1)

更新:如果我按如下方式配置数据源,我现在为下拉列表提取行:

                transport: {
                        read: {
                            url: ('@Url.Action("GetValues")'),
                            dataType: "json"
                        }
                    },
                    pageSize: 12
                });

但是,我仍然不知道如何将列表的选定值附加到模型中。