テンプレートを使用して剣道ツリービューをカスタマイズする際の問題

Question

階層データソースを使用して作成した剣道ツリービューがあります。そのノードがデータベーステーブルからソフト削除されていれば、赤色のノードはほとんど表示しません。 （ソフト削除されたレコードは、データベースフィールド "DEL_FLG"で識別されます。このフィールドがYに設定されている場合、レコードは削除されたものとみなされます。 ？

 var treeData = new kendo.data.HierarchicalDataSource({ 

     transport: { 
      read: { 
       url: NsMenuMaster.urls.getMenuTreeUrl, 
       data: data, 
       datatype: "json", 
       type: "POST" 
      } 
     }, 
     schema: { 
      model: { 
       id: "MenuConfigUid",     
       children: "Child" 

      } 
     } 
    }); 

    $("#MenuTreelist").kendoTreeView({ 
     dataSource: treeData, 
     dataTextField: ["MenuText"], 
     dataValueField: ["MenuConfigUid"], 
     height: 1000, 
     template: "#: item.DelFlg # == 'Y'" ? "<div style='color: red'>#: item.MenuText #</div>" : "<div style='color: black'>#: item.MenuText #</div>", 
     checkboxes: { 
      template: "<input type='checkbox' name='StudentClassID' value='#= item.id #' />", 
      checkChildren: true 
     }, 
     select: NsMenuMaster.onSelect 
    }); 

Answer 1

すなわち、ツリービューオプションにテンプレートの設定を追加します。

$("#MenuTreelist").kendoTreeView({ 
    template: kendo.template($("#treeview-template").html()), 
    .... 

やテンプレートのいくつかの種類

<script id="treeview-template" type="text/kendo-ui-template"> 
    # if (item.DEL_FLG) { # 
     <div style='color: red'>#: item.text #</div> 
    # } 
    else { # 
     <div>#: item.text #</div> 
    # } # 
</script> 

簡単な例：？

を更新し、質問した後

追加の詳細は、として

template: "# if (item.DelFlg == 'Y') { # <div style='color: red'>#: item.MenuText #</div> # } else { # <div style='color: black'>#: item.MenuText #</div> # } #" 

にテンプレートを変更し

：構文が混在値と剣道テンプレートとして適切にエンコードすることが極めて困難（不可能ではない）であります任意のjavascriptでレンダリングするので、実際のif-elseステートメントを使用する方が簡単です。

つの赤のノードとの例を更新：http://dojo.telerik.com/@Stephen/esened