将按钮/ html内容添加到kendo对话框标题栏

Question

我想根据给定的设计添加一个按钮，其中一些文本位于kendo对话框中的关闭按钮左侧。

我试过在对话框体中添加一个按钮，然后移动它的相对位置，按钮移动但它隐藏在标题栏下面。我检查并操作了关闭按钮和对话框标题的CSS，但是当标题可见时无法使按钮可见。

任何人都可以帮忙解决这个问题吗？

我在下面的链接中创建了一个dojo，你可以查看它。

https://dojo.telerik.com/osotAwAy

Answer 1

这是接近它的安全方法 - 使标题栏成为相对容器，并将按钮绝对放在该相对容器中。

首先，将button附加到标题栏中。

$(".k-dialog-titlebar").append(
  '<button id="btnMoveMe">Move Me</button>'
)

然后，添加以下CSS：

#btnMoveMe {
  background-color: blue;
  color: white;
  right: 30px;
  top: 12px;
  position: absolute;
}
.k-dialog-titlebar {
  position: relative;
}

Demo link

Answer 2

将overflow:visible应用于.k-prompt-container, .k-window-content：

.k-prompt-container, .k-window-content{overflow:visible}

并修改#btnMoveMe类：

#btnMoveMe {
background-color: blue;
color: white;
position: absolute;
right: 30px;
top: -41px;

}

Check here