定位编辑窗体弹出的telerik mvc网格

Question

任何人都可以告诉我，如果有一种方法来定位编辑形式的弹出窗口的mvc网格对齐屏幕的中心？

Answer 1

我的朋友发现了这样做的最简单的方法，通过使用Telerik的电网

 var popup = $("#" + e.currentTarget.id + "PopUp"); 
     //get the data window contained by the popup 
     var popupDataWin = popup.data("tWindow"); 

     //change popup title by calling the title 
     popupDataWin.title("Custom Title");    
     //center the window by calling the method center 
     popupDataWin.center(); 

把这一段代码在网格的客户端on_edit API的未曝光的内置功能之一，你会看到魔术

Answer 2

不确定是否可以使用配置选项自动完成 - 现在在现场演示弹出窗口在网格中居中。我疯狂的猜测是，你可以将它放在屏幕的中心与JavaScript ...

Answer 3

我已经完成这之前使用单独定义的Telerik Mvc窗口自定义弹出。我的示例代码如下所示：

<%= Html.Telerik().Window() 
    .Name("CompanyWindow") 
    .Title("Company Details") 
    .Buttons(b => b.Maximize().Close()) 
    .Visible(false) 
    .Modal(true) 
    .Width(600) 
    .Height(600) 
    .Draggable(true) 
    .Resizable() 
%> 

<% Html.Telerik().Grid<Vigilaris.Booking.Services.CompanySummaryDTO>() 
    .Name("CompaniesGrid") 
    .ToolBar(tb => tb.Template(() => { %> 
     <a href ="#" onclick="createCompany()" >Insert</a> 
     <% })) 
    .Columns(col => 
     { 
      col.Bound(c => c.Id).Width(20); 
      col.Bound(c => c.CompanyName).Width(120); 
      col.Bound(c => c.ResponsiblePersonFullName).Width(160); 
      col.Bound(c => c.ResponsiblePersonUserName).Width(160); 
      col.Bound(c => c.ResponsiblePersonEmail).Width(160); 
      col.Command(cmd => 
       { 
        cmd.Edit().ButtonType(GridButtonType.Image); 
       }).Title("Edit"); 
     }) 
    .DataKeys(keys => keys.Add(c => c.Id)) 
    .DataBinding(binding => binding.Ajax() 
     .Select("_IndexAjax", "Company") 
     .Insert("_InsertAjax", "Company") 
     .Update("_UpdateAjax", "Company") 
    ) 
    .Sortable() 
    .Render(); 
%> 

<script type="text/javascript"> 
    function createCompany() { 
     var url = '<%= Url.Action("New", "Company") %>' 
     $.post(url, function (data) { 
      var window = $('#CompanyWindow').data('tWindow'); 
      window.content(data); 
      window.center().open(); 
     }); 
    } 
</script> 

您将在createCompany函数中注意到我调用window.center（）。open（）。这明确地中心弹出。

但是，我不认为这正是你想要做的，但它可能会给你一些指向正确方向的指针。我希望它有帮助。

Answer 4

感谢家伙的有效答案。我知道我们可以定位一个自定义弹出窗口，但不适用于内置编辑模式窗口。

但是我所操纵的位置与 在客户端侧的jquery on_edit Telerik的网格的 API。

var popup = $("#" + e.currentTarget.id + "PopUp"); 

popup.css({ "left": ($(window).width()/2 - $(popup).width()/2) + "px", "top": ($(window).height()/2 - $(popup).height()/2) + "px" }); 

e.currentTarget.id给gridname。

Answer 5

@(Html.Telerik().Grid() 
.Name("FormFildGrid") 
.ClientEvents(events => events.OnEdit("Grid_onEdit")) 

）

function Grid_onEdit(e) { 
    var popup = $("#" + e.currentTarget.id + "PopUp"); 
    var popupDataWin = popup.data("tWindow"); 
    var l = ($(window).width()/2 - $(popup).width()/2); 
    popup.css({ "left": l + "px", "margin-left": "0", "width": $(popup).width() }); 
}