javascript 如何禁用级联 Kendo DropDownLists?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16223971/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 03:46:37  来源:igfitidea点击:

How to disable cascaded Kendo DropDownLists?

c#javascripttelerikkendo-uikendo-asp.net-mvc

提问by Jevgenij Nekrasov

I have to Kendo DropDownLists, I want to disable second DDL when the value of the first DDL is loaded and bounded to the value of my viewmodel.

我必须使用 Kendo DropDownLists,当第一个 DDL 的值被加载并绑定到我的视图模型的值时,我想禁用第二个 DDL。

So I have such code:

所以我有这样的代码:

@(Html.Kendo().DropDownList()
      .Name("FormGroupId")
      .HtmlAttributes(new { style = "width:250px" })
      .OptionLabel("Select form group...")
      .Template("#= data.Name # - #= data.Version #")
      .DataTextField("Name")
      .DataValueField("Id")
      .Events(events =>
      {
          events.Change("onFormGroupChanged");
          events.Select("onFormGroupSelected");
          events.Cascade("onFormGroupCascaded");
      })
      .DataSource(source =>
      {
            source.Read(read => { read.Route(RouteConfig.GetFormGroupNames.Name); });
      })
)

and

@(Html.Kendo().DropDownList()
      .Name("Schema")
      .HtmlAttributes(new { style = "width:250px" })
      .OptionLabel("Select schema...")
      .DataTextField("SchemaName")
      .DataValueField("SchemaId")
      .DataSource(source => 
      {
          source.Read(read =>
          {
              read.Route(RouteConfig.FilterFormSchemas.Name).Data("filterSchemas");
          })
          .ServerFiltering(true);
      })
      .Enable(false)
      .AutoBind(false)
      .CascadeFrom("FormGroupId")
)

I subscribe to the Cascade event on first DDL and try to disable second DDL from there, but it doesn't work.

我订阅了第一个 DDL 上的 Cascade 事件并尝试从那里禁用第二个 DDL,但它不起作用。

JS:

JS:

function onFormGroupCascaded(e) {
    $("#Schema").data("kendoDropDownList").enable(false);
}

回答by HaBo

You are already doing that.

你已经在这样做了。

Add events to first drop-down list:

将事件添加到第一个下拉列表:

.Events(e =>
{
    e.Change("change").Select("select").Open("open").Close("close").DataBound("dataBound");
})

Using JavaScript, handle the change event

使用 JavaScript,处理更改事件

<script>
    function change() {
        // get a reference to the dropdown list
        var dropdownlist = $("#dropdownlist").data("kendoDropDownList");
        // disable the dropdown list
        dropdownlist.enable(false);
    };
</script>

Looks like you are already doing this. What kind of error are you getting?

看起来你已经在这样做了。你得到什么样的错误?

回答by Luke Franklin

This is an old question, but binding to the CascadeFromevent will not prevent the drop down from being enabled. This is due to code in the Kendo library re-enabling it later in the execution order.

这是一个老问题,但绑定到CascadeFrom事件不会阻止启用下拉菜单。这是因为 Kendo 库中的代码稍后在执行顺序中重新启用它。

Instead, bind to the DataBoundevent to disable the drop down. This event occurs later in the execution stack and disables the input after the Kendo code enables it.

相反,绑定到DataBound事件以禁用下拉列表。此事件稍后在执行堆栈中发生,并在 Kendo 代码启用后禁用输入。

回答by Jhonattan

This code works in angular directive configuration

此代码适用于角度指令配置

dataBound: function (e) {
            this.enable(false);
        }