검도 UI - 그리드의 툴팁이 같은 내 그리드에 대한 툴팁을 만들려고 해요

Question

:

$("#grid").kendoTooltip({ 
    autoHide: true, 
    showOn: "mouseenter", 
    width:125, 
    height:125, 
    position: "right", 
    filter: ".k-grid-content a.hasTooltip", 
    content: kendo.template($("#storeTerritory").html()) 
}); 

템플릿 정의 : 여기 샘플을 설치했습니다

<script type="text/x-kendo-template" id="storeTerritory"> 
<div class="tooltipcontent"> 
    #for(var i = 0; i < Territories.length; i++){# 
     #if (Territories != 'null' && Territories != '') {# 
      <p>#=Territories[i].TerritoryDescription#</p> 
     #} else{# 
      <p>Information not available</p> 
     #}# 
    #}# 
</div> 
</script> 

: http://jsbin.com/iJunOsa/21/edit

나는 콘솔에서 ReferenceError: Territories is not defined 오류가 발생하는 경우 '윌튼'

,536에 나는 마우스 이상

의 난 후 툴팁이 나타납니다 일반 된 HTML로 storeTerritory 템플릿의 내용을 대체했다 가정 해 봅시다 :

<p>Wilton</p> 

문제는 무엇을 할 수 있을까?

Answer 1

문제는 툴팁과 관련된 모델이 없다는 것입니다.

$("#grid").kendoTooltip({ 
    autoHide: true, 
    showOn: "mouseenter", 
    width: 125, 
    height: 125, 
    position: "right", 
    filter: ".k-grid-content a.hasTooltip", 
    content: function (e) { 
     var row = $(e.target).closest("tr"); 
     var dataItem = $("#grid").data("kendoGrid").dataItem(row); 

     var template = kendo.template($("#storeTerritory").html()); 
     return template(dataItem); 
    } 
}); 

이 (demo 업데이트)

Answer 2

문제는 템플릿의 맥락에서 (그것을 실행하는 경우)이다 : i 그래서 실패로

<script type="text/x-kendo-template" id="storeTerritory"> 
    <div class="tooltipcontent"> 
     #if (Territories != 'null' && Territories != '') {# 
      <p>#=Territories[i].TerritoryDescription#</p> 
     #} else{# 
      <p>Information not available</p> 
     #}# 
    </div> 
</script> 

이 Territories로 아무것도 나.