Làm cách nào để bắt buộc cửa sổ giao diện người dùng Kendo ở giữa trang? và làm thế nào để vô hiệu hóa tất cả các hành động?

Question

Tôi đang cố gắng hiển thị cửa sổ giao diện người dùng Kendo ở trung tâm của trình duyệt, nhưng nó vẫn hiển thị ở cuối trang, điều này có nghĩa là phần hiển thị duy nhất của cửa sổ là thanh trên cùng, phần còn lại của cửa sổ là ra khỏi tầm nhìn, chỉ khi bạn kéo nó xung quanh bạn có thể xem nó đúng cách. Tôi không có phong cách áp dụng cho div đang được sử dụng cho cửa sổ vì vậy tôi bối rối là tại sao nó được hiển thị như thế.

Ngoài ra, tôi muốn tắt tất cả nút tác vụ trên thanh trên cùng của cửa sổ, cố gắng đặt một mảng hành động trống nhưng nút đóng được hiển thị là mặc định, có cách chỉ hiển thị tiêu đề của cửa sổ trên thanh trên cùng? Tôi muốn cửa sổ biến mất khi một nút trong đó được nhấp vào.

Đây là cách tôi là tạo ra cửa sổ:

var accessWindow = $("#accessDiv").kendoWindow({ 
    actions: [], 
    draggable: true, 
    height: "300px", 
    modal: true, 
    resizable: false, 
    title: "Access", 
    width: "500px" 
}); 

accessWindow.center(); 
accessWindow.open(); 

Đây là div của tôi với chỉ một nhãn, một đầu vào và một nút, không có CSS ​​đang được áp dụng cho nó vào lúc này:

<div id="accessDiv" style=" width: 100%; height: 100%; background-color: #fff;"> 
    <label>Enter access key</label> 
    <input type="text" /> 
    <input type="button" title="Enter" value="Enter" /> 
</div> 

Answer 1

bạn đã cố gắng che giấu nó, sau đó tập trung và mở nó?

var accessWindow = $("#accessDiv").kendoWindow({ 
actions: {}, /*from Vlad's answer*/ 
draggable: true, 
height: "300px", 
modal: true, 
resizable: false, 
title: "Access", 
width: "500px", 
visible: false /*don't show it yet*/ 
}).data("kendoWindow").center().open(); 

từ: http://www.kendoui.com/forums/ui/window/kendowindow-center-doesn-t-work-when-inside-an-iframe.aspx

Answer 2

1.Bạn cần trao đổi hai dòng mã cuối cùng. Trước hết bạn cần mở cửa sổ và sau đó bạn có thể căn giữa nó.

2.To hiển thị cửa sổ mà không cần bất kỳ hành động mà bạn cần phải vượt qua đối tượng rỗng:

actions: {} 

Answer 3

Hai dòng cuối cùng nên đọc:

accessWindow.data("kendoWindow").center(); 
accessWindow.data("kendoWindow").open(); 

Answer 4

Bạn có thể tham khảo mã sau đây cho vị trí cửa sổ của bạn.

var accessWindow = $("#accessDiv").kendoWindow({ 
        elem: 
        draggable: true, 
        modal: true, 
        title: "Title", 
        width:500, 
        visible: false, 
        position:{ 
         top:"15%", 
         left:"35%" 
        }, 
     }).data("kendoWindow").open(); 

Nếu bạn muốn cố định vị trí không phụ thuộc vào kích cỡ màn hình, sau đó sử dụng

position:{ 
    top:"20px", 
    left:"100px" 
} 

Nhưng nếu bạn muốn điều chỉnh vị trí cửa sổ của bạn tương đối, đầu và còn lại trong '%' sẽ làm việc cho bạn.

Answer 5

Biểu tượng bên dưới phù hợp với tôi. Nếu bạn không thích nó như một phương thức, hãy đặt nó thành false hoặc xóa nó.

var window = $("#addBlacklistWind"); 

    $("#btnAddBlacklist").bind("click", function() { 
      window.data("kendoWindow").center().open(); 
     }); 

     window.kendoWindow({ 
      width: "800px", 
      title: "Add New Blacklist", 
      modal: true, 
      visible: false, 
      actions: [ 
       "Maximize", 
       "Close" 
      ] 
     });