Kendo Grid模板 - 在模板中使用Javascript變量

我創建了兩個基於ajax調用的變量。該函數在頁面加載時運行，並且頁面加載後變量不會更改。Kendo Grid模板 - 在模板中使用Javascript變量

var approvalLevel; 
var fullName; 

$(function() { 
    $.ajax({ 
     type: "GET", 
     async: "false", 
     url: approvalLevelURL, 
     contentType: "application/json", 
     context: this, 
     dataType: "jsonp", 
     crossDomain: true, 
     success: function (data) { 
      getUser(data); 
     } 
    }); 
}); 

function getUser(data) { 
    approvalLevel = data.ApprovalLevel; 
    console.log(approvalLevel); 
    fullName = data.FullName; 
    console.log(fullName); 
};

然後我想在我的kendo窗口彈出模板中使用這些變量。該彈出窗口通過我的劍道網格上的「查看詳細信息」命令打開，並且函數showDetails從View Details點擊開始。

var wnd, detailsTemplate; 
wnd = $("#details") 
        .kendoWindow({ 
         title: "Customer Details", 
         modal: true, 
         visible: false, 
         resizable: false, 
         width: 300 
        }).data("kendoWindow"); 

       detailsTemplate = kendo.template($("#template").html()); 
      }); 

      function showDetails(e) { 
       e.preventDefault(); 

       var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 
       wnd.content(detailsTemplate(dataItem)); 
       wnd.center().open(); 
      }

不幸的是，當調試器到達的「wnd.content（detailsTemplate（DataItem的））」，拋出一個錯誤，指出approvalLevel是不確定的。

我不知道我需要做什麼來完成這項工作。我試着讓窗口內容從ajax調用中獲得url，並使用「data.ApprovalLevel」。該錯誤未被拋出，但值仍未定義。

我也試過'wnd.content（detailsTemplate（dataItem，approvalLevel，fullName））'，這也不起作用。

該模板不會讀取函數，但它正確識別來自kendo數據源的其他字段。

這是模板代碼：

<script type="text/x-kendo-template" id="detailTemplate"> 
<div id="tabs2">    
    <div id="cpTab2"> 
    # if (ChangeControlTypeApprovalLevel == 1) {# 
     <ul> 
      <li><label>Request Review:&nbsp; </label> 
       <p>No initial review required for a level one change</p> 
      </li> 
      <li class="comments"><label>Comments:&nbsp; </label> 
       <p>No initial review required for a level one change</p> 
      </li> 
     </ul> 
    #} else if (Status.toLowerCase().contains("approval")) {# 
      # if (ChangeControlTypeApprovalLevel == 2 && approvalLevel >= 2) {# 
        <ul> 
        <li><label>Request Review:&nbsp; </label> 
         <table id="horizontal-list" class="reviewStatus"> 
          <tr> 
           <td><label> Reviewed By: </label><br/> #= fullName #</td> 
           <td><label> Reviewed Date: </label><br/>#= getToday() #</td> 
           <td><label> Reviewed Status: </label><br/><input name="approved" data-bind="value:approved" class="dropDownApproval" /></td> 
          </tr> 
         </table> 
        </li> 
        <li><label>Comments:&nbsp; </label>    
         <li><textarea type="text" class="k-input k-textbox" name="Comments" data-bind="value:Comments"></textarea></li> 
         <li><button class="k-button" onclick="initialReviewTab">Submit</button></li>      
        </li> 
       </ul> 
      #} # 
    </div> 
</div> 
</script>

任何幫助將不勝感激。我一直堅持這一段時間。

來源

2016-12-14 Kellee-Morgan

如果有人遇到這個問題，我找到了解決方案。由於我的模板不接受全局變量或函數，我最終不得不爲每個變量和showDetails函數中的函數創建dataItem。

function showDetails(e) { 
      e.preventDefault(); 
      var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 
      dataItem.approvalLevel = approvalLevel; 
      dataItem.fullName = fullName; 
      dataItem.date = getToday(); 
      wnd.content(detailsTemplate(dataItem)); 
      wnd.center().open(); 
     }

現在一切都很好。

來源

2016-12-14 20:27:52

Kendo Grid模板 - 在模板中使用Javascript變量

回答

相關問題