如何在 MVC 中的 Html ActionLink 上获得 Bootstrap 弹出功能?
How to get Boostrap popover feature on an Html ActionLink in MVC?
我有一个带有 ActionLinks 的 table。我想弄清楚如何包装这些,以便我可以显示 bootstrap 弹出功能。任何帮助表示赞赏!
这是我在尝试进行任何更改以允许 Bootstrap-Popover 功能之前所拥有的:
<div class ="container">
<table class="table table-striped table-bordered">
<tr>
<th></th>
<th></th>
<th>Group Name</th>
<th>Description</th>
<th>Last Change</th>
</tr>
<% foreach (var item in Model) { %>
<tr>
<td>
<% if (isAdmin) { %><%=Html.ActionLink("Edit", "Edit", new { id = item.GroupId }, new { @class = "fa fa-pencil", title = "Edit Group" })%>
</td>
<td><%= Html.ActionLink("Details", "Details", new { id=item.GroupId }, new { @class = "fa fa-info_circle", title = "Group Details"})%></td>
<td><%= Html.Encode(item.GroupName) %></td>
<td><%= Html.Encode(item.Description) %></td>
<td><%=Html.Action("ConvertToLocalTime", new {utcTime = item.LastChange})%></td>
</tr>
<% } %>
</table>
</div>
我知道这个问题已经很老了,但我还是在这里结束了。所以,这就是我得到的。也许我可以帮助别人。
Tooltip 和 Popover 数据 api 是可选的,这意味着您必须自己初始化它们。
<script type="text/javascript">
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
然后,在您的代码中:
@Html.ActionLink(" ", "Delete", null, new { id = item.id}, new { @class = "glyphicon glyphicon-remove", data_toggle ="tooltip", data_placement = "top", title = "Delete" })
我有一个带有 ActionLinks 的 table。我想弄清楚如何包装这些,以便我可以显示 bootstrap 弹出功能。任何帮助表示赞赏!
这是我在尝试进行任何更改以允许 Bootstrap-Popover 功能之前所拥有的:
<div class ="container">
<table class="table table-striped table-bordered">
<tr>
<th></th>
<th></th>
<th>Group Name</th>
<th>Description</th>
<th>Last Change</th>
</tr>
<% foreach (var item in Model) { %>
<tr>
<td>
<% if (isAdmin) { %><%=Html.ActionLink("Edit", "Edit", new { id = item.GroupId }, new { @class = "fa fa-pencil", title = "Edit Group" })%>
</td>
<td><%= Html.ActionLink("Details", "Details", new { id=item.GroupId }, new { @class = "fa fa-info_circle", title = "Group Details"})%></td>
<td><%= Html.Encode(item.GroupName) %></td>
<td><%= Html.Encode(item.Description) %></td>
<td><%=Html.Action("ConvertToLocalTime", new {utcTime = item.LastChange})%></td>
</tr>
<% } %>
</table>
</div>
我知道这个问题已经很老了,但我还是在这里结束了。所以,这就是我得到的。也许我可以帮助别人。
Tooltip 和 Popover 数据 api 是可选的,这意味着您必须自己初始化它们。
<script type="text/javascript">
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
然后,在您的代码中:
@Html.ActionLink(" ", "Delete", null, new { id = item.id}, new { @class = "glyphicon glyphicon-remove", data_toggle ="tooltip", data_placement = "top", title = "Delete" })