2013-08-09 1 views
7

に編集用のカスタムkendo.ui.Windowを作成する私はkendo.Uiでスターターよ、私はEditで、ユーザーのクリックをしたいグリッドを作成どのようkendo.ui.grid

@(Html.Kendo().Grid<BrandViewModel>(Model) 
    .Name("Grid") 
    .Columns(columns => 
    { 
     columns.Bound(p => p.BrandName); 
     columns.Bound(p => p.BrandAbbr); 
     columns.Bound(p => p.SrcImage); 

     columns.Command(command => command.Custom("Edit").Click("editItem")); 

    }) 

    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Read(read => read.Action("CustomCommand_Read", "Brand")) 
     .Model(model => model.Id(p => p.Id)) 

       ) 
) 

ために、このコードを書きます剣道ウィンドウ内のボタンオープンEdit view私はこのコード

@(Html.Kendo().Window().Name("Details") 
    .Title("Customer Details") 
    .Visible(false) 
    .Modal(true) 
    .Draggable(true) 

    .Width(300) 
) 



<script type="text/x-kendo-template" id="template"> 
    <div id="details-container"> <!-- this will be the content of the popup --> 
     BrandName: <input type='text' value='#= BrandName #' /> 

    </div> 
</script> 

とJavaスクリプトコード記述:

<script type="text/javascript"> 
    var detailsTemplate = kendo.template($("#template").html()); 

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

     var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 

     $("#Details").data("kendoWindow").refresh({ 
      url: "/Brand/Edit/" + dataItem.Id 
     }); 
     $("#Details").data("kendoWindow").open(); 



    } 
</script> 

このCを私はボタンをクリックして、しかし、私がクリックしたときに二time.Iは、次のエラーに

0x800a138f - JavaScript runtime error: Unable to get property 'refresh' of undefined or null reference 

に遭遇した初めてODE作業罰金私を助けてください、私は同様の問題を持っていた覚えているおかげで、すべての

+0

はジョフリー・カーン@あなたの質問とは何の関係も:) –

答えて

3

このコントロールで今、それは私のために、次のJavaScriptコードで動作します:

<script type="text/javascript"> 
    var detailsTemplate = kendo.template($("#template").html()); 
    var windowObject; 

    $(document).ready(function() { 
     windowObject = $("#Details").data("kendoWindow"); 
    }); 

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

     var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 

     windowObject.refresh({ 
      url: "/Brand/Edit/" + dataItem.Id 
     }); 
     windowObject.open(); 
    } 
</script> 

希望します!

+0

がなかったあなたの質問から新しい何かを学びました。 – Pouya

+0

@Joffrey Kern - これは、私がkendow Windowをテンプレートにバインドしていた問題でも助けになりました。ありがとう。 – callisto

1

デフォルトでは、クロージャでウィンドウが破棄される(DOMから削除される)という問題があります。私は下の例で追加した "未定義"の条件を削除することをお勧めします。代わりに、最初に "詳細" divを作成しないでください。このコードの動作細かい感謝を助け、私のため:

<script type="text/javascript"> 
    var detailsTemplate = kendo.template($("#template").html()); 

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

     var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 

     if($("#Details") == undefined) 
      $("body").append("<div id=\"Details\"></div> 

     $("#Details").data("kendoWindow").refresh({ 
      url: "/Brand/Edit/" + dataItem.Id 
     }); 
     $("#Details").data("kendoWindow").open(); 



    } 
</script>