kendo ui gridリモートテンプレートから編集可能なポップアップ

Question

グリッド編集可能なポップアップのhtmlテンプレートをアングルアプリにロードしようとしています。私は、グリッド内でこの

<script> 

    var templateLoader = (function($,host){ 
     //Loads external templates from path and injects in to page DOM 
     return{ 
      loadExtTemplate: function(path){ 
       var tmplLoader = $.get(path) 
       .success(function(result){ 
        //Add templates to DOM 
        $("body").append(result); 
       }) 
       .error(function(result){ 
        alert("Error Loading Templates -- TODO: Better Error Handling"); 
       }); 

       tmplLoader.complete(function(){ 
        $(host).trigger("TEMPLATE_LOADED", [path]); 
       }); 
      } 
     }; 
    })(jQuery, document); 

    /* 
    ** Load the template file 
    */ 
    templateLoader.loadExtTemplate("tpl/Maintenance/policyProp.htm"); 


    /* 
    ** Loading external templates with in this function. 
    */ 


</script> 

を追加したHTMLページ内の

：

  editable: { 
       confirmation: true, 
       mode: "popup", 
       template: kendo.template($("#Policy_editor").html()) 
      }, 

HTMページ：

<script type="text/x-kendo-template" id="Policy_editor" > 
html code here 
. 
. 
. 
. 
</script> 

私は "#Policy_editorは" anから来てほしいです外部のHTMLページ。 ご協力いただきありがとうございます！

Answer 1

個人的には、コードにいくつか変更を加えます。体の中にコンテンツを追加していますが、それはあなたが望むものではありません。 javascriptタグ内にコンテンツを追加する必要があります。使用しているスニペットは、jQueryの$.get()メソッドへのラッパーのようなものではありませんが、リクエスト結果の処理方法を決めることはできません。あなたは、コールバックのセットで今

.success(function(result){ 
    if (successCallback) { 
     successCallback(result); 
    } 
}) 

その後

loadExtTemplate: function(path, successCallback) { 
           ^this parameter here 

を：

要求ラッパーにコールバックを追加します：あなたはそれを動作させるために、それを変更する必要がありますその内部にグリッドを作成する必要があります。

templateLoader.loadExtTemplate("tpl/Maintenance/policyProp.htm", function(templateHtml) { 
    $("#grid").kendoGrid({ 
    .... 
     editable: { 
     confirmation: true, 
     mode: "popup", 
     template: kendo.template(templateHtml) 
     }, 
    }); 
}); 

これはなぜですか？の後に、javacriptタグにリモートhtmlを追加できるので、グリッドの初期化が行われます。非同期要求であるため、グリッドの初期化時にテンプレートタグは空になるので、ウィジェットは空のテンプレートをあなたの列に設定します。 htmlテンプレートの内容を取得するには、リクエストが完了した後にグリッドを作成する必要があります。既にコールバック内にグリッドを作成しているので、その内容をタグに設定する必要はありません。を使用してください。にはにテンプレートhtmlが含まれています。

そのコールバックにグリッドを作成できない場合、または作成したくない場合は、ウィジェットがすでに作成されているため、リクエストが完了したときにそのオプションを変更できます。 setOptions()を使うことができますが、この最後のオプションはお勧めしません。初期化後に剣道ウィジェットのオプションを変更しようとすると良い経験はありません。