2017-10-05 75 views
0

我有一個內聯編輯選項的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

+0

什麼是你的問題?道場的例子只是你想要的。 – DontVoteMeDown

+0

@DontVoteMeDown感謝您的評論,但它不起作用。我已經設置了id,並且是已刪除的選項,它不會給出任何運行時錯誤,但未禁用該選項 –

+1

沒有足夠的源代碼來解決問題。你應該添加更多甚至是dojo的例子。否則將很難提供幫助。 – DontVoteMeDown

回答

0

由於問題緊緊圍繞以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()) 
        });