<script>
function showData(recId,e)
{
Visualforce.remoting.Manager.invokeAction('{!$RemoteAction.ControllerClass.getPopData}',
recId,"{!record.Id}",
function (result, event) {
if(event.status)
alert(result); //Alerts correct value
$('.li').popover({content:result}); //Holds previous value
}, {buffer:false}
);
}
</script>
现在我面临的问题是,如果列表中显示了3个项目,我单击的第一个项目显示的是正确的数据,但单击任何其他项目都会显示相同的先前数据,直到我刷新页面并单击为止。然而,在远程操作中,我可以看到每次都会获取正确的数据,但在页面中,它总是显示我单击的第一个项目。
警报显示正确的更新内容,但弹出窗口未在框中设置相同的内容。
我还尝试了下面的方法,这是我在使用setcontent
的一个答案中找到的。这在某种程度上是可行的,但我必须单击两次才能获得正确的内容。在第一次onclick中,它显示了之前的值:
$('.li').popover({
content: 'Loading...'
});
$('.li').attr('data-content', res);
var popover = $('.li').data('popover');
popover.setContent();
popover.$tip.addClass(popover.options.placement);
你知道我该怎么解决这个问题吗?
根据评论进行了更新。它几乎可以工作,但当我一个接一个地单击项目时,如果我将鼠标移出并悬停在同一项目上,即使我可以看到远程操作调用正在发生,它也无法显示弹出窗口。
<script>
function showPopup(recId,e)
{
var res='';
Visualforce.remoting.Manager.invokeAction('{!$RemoteAction.ControllerClass.getData}',
recId,"{!record.Id}",
function (result, event) {
if(event.status)
res=result;
$('.li').popover("destroy").popover({content:res, placement: "bottom", template: '<div class="popover" style="width:250px; font-size:12px"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
});
},{ buffer: false}
);
}
</script>
发布于 2018-06-27 03:22:47
给定每个BS3文档的基本弹出窗口,您可以:
<button type="button" class="btn btn-primary li"
title="Popover title" >
Click to toggle popover
</button>
使用<script>
// Where the `html` property is true or false
// if your returned dynamic data is
// html or simple text respectively.
var po_options = {
html : true,
content : function() {
// $(this) is set to the element with the popover
// get your_data,
return your_data;
}
};
并通过以下方式初始化:
$('.li').popover(po_options);
在此代码片段中,您可以看到带有返回内容的弹出窗口。您所需要做的就是根据所单击的.li
传递适当的参数,并将您的数据检索代码传递给它,这样就可以了
var po_options = {
html: true,
content: function() {
var p1 = $(this).data("param1");
return '<span>' + p1 + '</span>';
}
};
$('.li').popover(po_options);
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<button type="button" class="btn btn-primary li" title="Popover 1" data-param1="Parameter1">
Click to toggle popover 1
</button>
<br />
<br />
<button type="button" class="btn btn-primary li" title="Popover 2" data-param1="Parameter2">
Click to toggle popover 2
</button>
附录
不是很正确。我上面的示例旨在显示从单击按钮的数据属性中获取的信息,并旨在向您展示一种将参数传递给工具提示内容处理程序的方法
请考虑以下内容:
我假设你所有的弹出按钮都标记了.li
类,所以像这样初始化弹出按钮:
$('.li').popover(po_options);
其中po_options
定义为
var po_options = {
html : true,
content : function() {
var p1 = 'Loading...';
Visualforce.remoting.Manager.invokeAction(
'{!$RemoteAction.ControllerClass.getData}',
recId,"{!record.Id}",
function (result, event) {
if(event.status) {
p1 = result;
}
});
return p1;
}
};
现在有几件事需要考虑:
如果调用成功,那么在result
invokeAction
阻塞或非阻塞的调用,即同步或非阻塞Item #2非常重要。
如果调用是同步的,那么假设result
是html文本,那就没问题了。
但是,如果调用是异步的,则不太可能看到工具提示内容,因为po_options.content
处理程序可能会在invokeAction参数result
获得值之前返回。
https://stackoverflow.com/questions/51036685
复制相似问题