带有 x-editable 插件的引导工具提示

Question

我正在尝试将工作工具提示和 x-editable 插件一起制作

这是我的锚打印代码

  <?php $Cvstate.="<a href=\"#\" id=\"cvstage\" style=\" text-decoration:none;\"  data-toggle=\"tooltip\" data-container=\"body\" data-placement=\"top\" data-original-title=\"{$row['idate']}\">Cv Send</a><br><br>" ;?>

当添加 x-editable 插件属性时看起来像这样

  <?php $Cvstate .= "<a href=\"#vacancy\" id=\"cvstage\" style=\"margin: 15px; text-decoration:none;\" data-type=\"select\" data-pk=\"1\"  data-source=\"/groups\" data-value=\"{$row['id']}\" data-title=\"Select group\" data-toggle=\"tooltip\" data-container=\"body\" data-placement=\"top\" data-original-title=\"{$t['date']}\">Cv Send</a> <br>"; ?>

问题是当我将data-toggle="tooltip" 添加到它时，x-editable 插件不起作用，当我删除它时，x-editable 插件起作用，但工具提示不起作用。知道这个错误是从哪里来的吗？

Link to plugin

Answer 1

我还遇到了 x-editable 和引导工具提示之间的冲突。在阅读了Bootstrap tooltip data-toggle 的信息后，我决定尝试使用以下工具提示选择器。

$("body").tooltip({
    selector: '[data-title]'});
});

这适用于 x-editable 插件，因为您可以指定 data-title 作为选项之一。例如

<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-title="Enter username">superuser</a>

您只需要确保更新所有对您之前的工具提示选择器的引用。

这将使您能够在同一元素上使用 x-editable 和引导工具提示。

Answer 2

这是固定代码。

JS

$("body").tooltip({
    selector: '[data-title]'
});

HTML

<a href="#" id="username" data-type="text" data-pk="1" data-url="/post" data-title="Enter username">superuser</a>