kendo mvc window установлен как модальный, но не открывается как модальный и обыкновенный центр правильно

Question

У меня проблема с моим элементом окна.

Это код, который я имею в представлении

@(Html.Kendo().Window() 
    .Modal(true) 
    .Name("AddDatabaseModal") 
    .Title("Add Database") 
    .Visible(false) 
    .Width(400) 
    ) 

я загрузить его на кнопку мыши ...

function addDatabase() { 
    alert("addButtonClicked"); 
    var selected_pk = $('#database_pk').val();  
    $("#AddDatabaseModal").kendoWindow({ 
     content: { 
      url: "Home/AddDatabase"    
     } 
    }) 
    var window = $("#AddDatabaseModal").data("kendoWindow").center().open(); 
} 

ActionResult запускается на контроллере и вид заполняется и откроется окно

НО, но не модальный, я могу щелкнуть по любому из элементов управления, за которыми я не хочу ... и центр по какой-то причине центрирует его слева справа, но толкает окно вниз o что большая часть из них находится ниже видимого окна. Мне нужно прокрутить вниз, чтобы просмотреть окно ... и это не потому, что окно имеет такой размер, чтобы начать с ... нет полосы прокрутки в браузере, когда я нажимаю кнопка .. окно всплывает, и вдруг появляется полоса прокрутки, и мне нужно прокрутить вниз, чтобы просмотреть содержимое окна.

Answer 1

Здесь вы определяете окно в HTML и на том же id снова, что вы определяете другое окно в javascript. Таким образом создаются два экземпляра окна. Чтобы достичь своей цели, вы определяете окно в HTML и открываете его в функции «addDatabase». Или определите само окно внутри функции «addDatabase».

Малый demonstartion:

Случай 1:

<div> 
    @(Html.Kendo().Window() 
     .Modal(true) 
     .Name("AddDatabaseModal") 
     .Title("Add Database") 
     .Visible(false) 
     .Width(400) 
     .LoadContentFrom("AddDatabase", "Home") 
) 
</div> 

<script> 
function addDatabase() { 
    alert("addButtonClicked"); 
    var selected_pk = $('#database_pk').val();  
    $("#AddDatabaseModal").data("kendoWindow").center().open(); 
} 
</script> 

Случай 2:

<div id="AddDatabaseModal"></div> 

<script> 
function addDatabase() { 
    alert("addButtonClicked"); 
    var selected_pk = $('#database_pk').val();  
    $("#AddDatabaseModal").kendoWindow({ 
        width: "400px", 
        title: "Add Database", 
        content: "../Home/AddDatabase", 
        visible: false, 
        modal: true 
       }); 
    $("#AddDatabaseModal").data("kendoWindow").center().open(); 
} 
</script> 

Надеется, что это помогает. Для дальнейшего запроса оставьте свои комментарии.