剣道窓の位置

Question

私はbootstrapテンプレートとKendo Windowを使用していますが、これまでのモーダルな剣道の位置付けはそれほど難しくありませんでした。 しかし、私は特定の領域に対して別のレイアウトを使用するので、私は自分自身がその問題に問題を抱えていることがわかります。

コードを中心（x軸）モーダル剣道ウィンドウを作成することが期待される次

@(Html.Kendo().Window() 
    .Name("Window1") 
    .Visible(false) 
     .Position(builder => builder.Top(100)) 
     .Draggable() 
     .Content(@<div class="kendoWindowContent"><p>Please wait...</p><div class="k-loading-image"></div></div>) 
    .Width(1000) 
     .Title("Title1") 
     .Actions(actions => actions.Close()) 
     .Modal(true) 
     .Resizable()) 

を介して表示..and：

var wnd = $("#ownerVoucherCreateWindow").data("kendoWindow"); 

     wnd.refresh({ 
      url: '@Url.Action("Voucher_Create", "OwnerVoucher")' 
     }); 

     wnd.open(); 

ウィンドウが中央に表示されていないbeeingてx軸の

剣道ウィンドウを中央に配置するための制約はありますか？

Answer 1

ウィンドウのセンタリングでは、center()メソッドを使用する必要があります。 WindowコンテンツはAjax経由でロードされるので、そのrefreshイベントにウィジェットを集中させる必要があります。

var wnd = $("#ownerVoucherCreateWindow").data("kendoWindow"); 
wnd.one("refresh", function(e) { 
    e.sender.center(); 
}); 
wnd.refresh({ 
    url: '@Url.Action("Voucher_Create", "OwnerVoucher")' 
}); 
wnd.open(); 

その代わりjust onceの、すべてのリフレッシュイベントで中心にトリガすることも可能です。

別のオプションは、widthとheightを明示的に設定することです。この場合、ウィジェットの寸法はコンテンツの変更（ロード）後に変更されないため、いつでもウィンドウを中央に配置することができます。

Answer 2

ok私はすべての剣道のウィンドウが表示されるようになったのは幸運でした。 私は、x軸の位置だけが設定されていると、ウィンドウが自動的にy軸に中心を置くと仮定しました。 これはそうではないようです。なぜこれが過去に働いていたのか分かりません。 はとにかく、私はブラウザのビューポートとウィンドウ幅に応じて、ウィンドウを中央にする方法を考え出し：

するvar WND =：

念のanybodesに...

function displayWindowCenteredOnYAxis(kendoWindow) { 

     var windowOptions = kendoWindow.options; 

     var pos = kendoWindow.wrapper.position(); 

     var viewPortWidth = $(window).width(); 
     var wndWidth = windowOptions.width; 

     pos.left = viewPortWidth/2 - wndWidth/2; 

     kendoWindow.wrapper.css({ 
      left: pos.left 
     }); 

     kendoWindow.open(); 

    } 

使用を気遣います$（ "＃id"）。データ（ "kendoWindow"）;

wnd.refresh({ 
     url: '@Url.Action("Action", "Controller")' 
    }); 



    displayWindowCenteredOnYAxis(wnd);