【问题标题】:How to Trigger DropDownList Events Inside Kendo Scheduler Resources (Popup)如何在 Kendo 调度程序资源中触发 DropDownList 事件(弹出窗口)
【发布时间】:2014-03-03 12:35:57
【问题描述】:

我的.Cshtml 页面中有以下剑道调度程序代码

<div class="space-6"></div>
    <div class="row">
      <label>Procedure Code</label>
        @Html.Partial("Partials/_ProviderCodeHint")
  </div>

@(Html.Kendo().Scheduler<AppoinmentModel>()
    .Name("AppoinmentModelSchduler")
    .Views(views =>
    {
        views.DayView();
        views.WorkWeekView(workWeekView => workWeekView.Selected(true));
        views.WeekView();
        views.MonthView();
        views.AgendaView();
    })
    .Resources(resource =>
    {
        resource.Add(m => m.ProcedureCode_Id)
             .Title("Pro Code")
             .DataTextField("DisplayText")
             .DataValueField("DataField")
             .Name("ProcedureCode_Id")
             .DataSource(p => p.Read(x => x.Action("GetProcedureCodes", "OfficeAppointment").Data("_ProviderCodeHint_SupplementData")).ServerFiltering(true));
    })
    .DataSource
    (
         d => d.Model(m =>
         {
             m.Id(f => f.Id);
             m.Field(f => f.Title).DefaultValue("No title");
             m.RecurrenceId(f => f.RecurrenceId);
         })
        .Events(x => x.Error("kendoGridErrorHandle"))
        .ServerOperation(true)
        .PageSize(500)
        .Read(x => x.Action("Scheduler_Appointment_Read", "OfficeAppointment").Data("Scheduler_SupplementData"))
        .Create(x => x.Action("Scheduler_Appointment_AddUpdate", "OfficeAppointment").Data("Scheduler_SupplementData"))
        .Update(x => x.Action("Scheduler_Appointment_AddUpdate", "OfficeAppointment").Data("Scheduler_SupplementData"))
        .Destroy("Scheduler_Appointment_Delete", "OfficeAppointment")
    )
)

我正在通过调用另一个局部视图来绑定 Drop down。

部分视图代码

<script>

    function _ProviderCodeHint_SupplementData() {
        var providerCodeCombo = $("#_ProviderCodeHint").data("kendoDropDownList");

        return {
            ProviderCodeId: providerCodeCombo.value()
        };
    }

    function providerCodeHintOnChange() {
        alert('Tested');
    }

</script>

@(
 Html.Kendo().DropDownList()
        .Name("_ProviderCodeHint")
        .HtmlAttributes(new { @class = "input-xlarge" })
        .DataValueField("DataField")
        .Events(x => x.Change("providerCodeHintOnChange"))
        .DataTextField("DisplayText")
        .DataSource(p => p.Read(x => x.Action("GetProcedureCodes", "OfficeAppointment").Data("_ProviderCodeHint_SupplementData")).ServerFiltering(true))
)

Evert 很好用。但是当我尝试添加下拉列表事件时。它不会被解雇。我试过剑道的Jquery.Events

如果我使用剑道的.Events,它会在资源本身加载时间时触发。

引导我在单击调度程序单元格 onclick 加载弹出窗口后触发 onchange event 内部弹出窗口。

由于加载优先级,现在Jquery 不适用于Onchange

【问题讨论】:

  • 抱歉,只是为了澄清您使用 .events 时会发生什么...??
  • 嗨@Shaz 没有问题,抱歉回复晚了。当我在Resources 使用 .event 时,我会为下拉列表创建或加载时间中的每个项目触发持续事件。
  • 谢谢@Shaz 我通过您的评论利用了我对事件的思考。 :)

标签: c# kendo-ui kendo-grid kendo-asp.net-mvc kendo-scheduler


【解决方案1】:

我自己找到了解决方案。,

在加载Scheduler 时,我自己调用了script function and initialized events .Events(eve =&gt; eve.Change("OnLoad")

局部视图:

.DataSource
    (
         d => d.Model(m =>
         {
             m.Id(f => f.Id);
             m.Field(f => f.Title).DefaultValue("No title");
             m.RecurrenceId(f => f.RecurrenceId);
         })
        .Events(x => x.Error("kendoGridErrorHandle"))
        .ServerOperation(true)
        .PageSize(500)
        .Read(x => x.Action("Scheduler_Appointment_Read", "Appointment").Data("Scheduler_SupplementData")).Events(eve => eve.Change("OnLoad"))
        .Create(x => x.Action("Scheduler_Appointment_AddUpdate", "Appointment").Data("Scheduler_SupplementData"))
        .Update(x => x.Action("Scheduler_Appointment_AddUpdate", "Appointment").Data("Scheduler_SupplementData"))
        .Destroy("Scheduler_Appointment_Delete", "Appointment")
    )

在脚本中:

function OnLoad() {
        $('select[data-bind="value:ProcedureCode_Id"]').change(function () {
            $('input[data-bind="value:title"]').val($('select[data-bind="value:Provider_Id"]')[0].selectedOptions[0].text + ", " + $('select[data-bind="value:ProcedureCode_Id"]')[0].selectedOptions[0].text);

        });

        $('select[data-bind="value:Provider_Id"]').change(function () {
            $('input[data-bind="value:title"]').val($('select[data-bind="value:Provider_Id"]')[0].selectedOptions[0].text + ", " + $('select[data-bind="value:ProcedureCode_Id"]')[0].selectedOptions[0].text);

        });
    }

【讨论】:

    猜你喜欢
    • 2016-08-20
    • 1970-01-01
    • 2022-10-01
    • 2016-10-05
    • 1970-01-01
    • 1970-01-01
    • 2015-06-29
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多