如何设置kendo列模板中元素的弹出位置锚
我使用kenod来创建我的Web。我有如下所示的列模板
var template = "<input id='details-button' type='image' src='images/detail_button.png' ng-click='showDetals(this.dataItem)'/>#: Contact #";
每次单击详细信息按钮时，我都想弹出一个窗口，弹出窗口的位置应该在我单击的按钮的右下角。以下是我目前的工作
var popup = $("#detailsPopup");
popup.kendoPopup({
anchor: "#details-button",
origin: "bottom right",
});
但不起作用。每次，弹出显示在第一行按钮的右下角，而不是我单击的按钮的右下角。
检查生成的html，所有按钮的id都是相同的(细节-按钮)。因此，弹出总是显示与第一个细节-按钮。
更新：
这是我改变的解决方案，但仍然不起作用。
function popupDetails(item) {
detailsGrid.kendoGrid({
columns: ...,
dataSource: item.Details
});
var anchor = "#details-button" + item.id;
var popup = $("#details-popup");
popupp.kendoPopup({
anchor: anchor,
origin: "bottom right",
});
popup.data("kendoPopup").open();
}
有人能帮忙吗？
回答 1
Stack Overflow用户
发布于 2016-09-05 08:05:23
在列模板中使用静态ID自然会对每一行重复它，因此这不是一个可行的选项。您可以将静态ID部分(“详细信息-按钮”)与网格dataItem的ID值连接起来，这样您将拥有真正唯一的详细按钮ID。
template: "<input id='details-button#: MyGridItemID #' />"然后，将Kendo弹出初始化代码更改为使用生成的按钮ID。
更新
Kendo弹出初始化语句不能使用绑定表达式(#: ... #)，因为它位于Kendo列模板之外。使用传递给showDetails函数的showDetails对象，并为anchor设置再次检索和连接myId。
更新2
似乎您正在从同一个元素创建一个新的Kendo弹出实例。我建议您将旧实例(也将删除它的DOM) 销毁，然后在页面上追加一个新的<div>，并从其中创建一个新的弹出窗口。
我不确定popupp部件，它可能是复制粘贴错误，或者您应该在那里得到JS错误。
更新3
另外，可以使用一个Kendo工具提示实例来实现类似的行为，该实例的配置方式如下：
- 工具提示小部件元素是网格
table - 有一个适当的
filter集，它指向细节按钮，例如通过他们的CSS类。 showOn设置为"click"- 使用
content函数根据当前目标设置工具提示内容。
https://stackoverflow.com/questions/39323180
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号