Kendo Grid内联编辑禁用下拉选项

问题描述：

我有一个内联编辑选项的Kendo Grid。我有一个用户必须从中选择值的下拉菜单。我想动态地禁用下拉菜单中的某些项目。我必须从下拉列表中动态地启用和禁用选项，因此我将禁用的对象存储在与源代码不同的数组中。 Here就是一个例子。Kendo Grid内联编辑禁用下拉选项

columns: [{ 
      field: "xxxx", 
      title: "xxxx", 
      template: function (dt) { 
       return dt.xxxx; 
      }, 
      editor: function (container, options) { 
       $('<input name="' + options.field + '"/>') 
        .appendTo(container) 
        .kendoDropDownList({ 
         dataTextField: "textField", 
         dataValueField: "ValueField", 
         dataDisabled:arrayOfObjThatShouldBeDisabled,//Don't work I know 
         dataSource: { 
          data: myDataSource // DYNAMIC SOURCE 
         } 
        }); 
      } 
     }]

这里是剑道网站sample。

Another Example

什么是你的问题？道场的例子只是你想要的。 – DontVoteMeDown

@DontVoteMeDown感谢您的评论，但它不起作用。我已经设置了id，并且是已删除的选项，它不会给出任何运行时错误，但未禁用该选项 –

没有足够的源代码来解决问题。你应该添加更多甚至是dojo的例子。否则将很难提供帮助。 – DontVoteMeDown

答

由于问题紧紧围绕以this Kendo UI Dojo保持它的基地我试图解释的代码是不和它如何映射到我的问题是什么。

首先，我们需要某种标志来标识选项必须被禁用或不是因为引入isDeleted标志与false，将相应地更新。

然后我们需要在html中添加以下部分，这里是魔术发生的地方，它会给你一个模板，它将决定我们是否需要将k-state-disabled类添加到选项或不取决于isDeleted的值。

<script id="template" type="text/x-kendo-template"> 
    <span class="#: isDeleted ? 'k-state-disabled': ''#"> 
     #: name # 
    </span> 
</script>

有了，我必须做出小的改动代码如下所示，它的工作

$('<input name="' + options.field + '"/>') 
        .appendTo(container) 
        .kendoDropDownList({ 
         dataSource: { 
         data: myDataSource // DYNAMIC SOURCE 
         }, 
         dataTextField: "textField", 
         dataValueField: "ValueField", 
         select: function (e) { 
          if (e.dataItem.isDeleted) { 
           e.preventDefault(); 
          } 
         }, 
         template: kendo.template($("#template").html()) 
        });

Kendo Grid内联编辑禁用下拉选项

相关推荐