Tooltip error display first hover

Sometime hover tooltip, its show left bottom body, incorrect positions
demo: https://imgur.com/a/cGopptJ

$(`#kt_datatable`).DataTable({
processing: true,
serverSide: true,
ajax: {
url: `/${dashboard}/${site.url}/ajax/`,
type: "POST",
dataSrc: function(json) {
if(json.status) {
return json.data;
} else {
Swal.fire({
title: "Error",
text: json.msg,
icon: "error"
})
}
}
},
select: {
style: 'multi',
selector: 'td:first-child input[type="checkbox"]'
},
columns: [...],
columnDefs: [...],
fnDrawCallback: function(data) {
$('[data-bs-toggle="tooltip"]').tooltip();
try {
clipboard.destroy();
} catch(ex) {}
clipboard = new ClipboardJS('[data-clipboard=true]').on('success', function(e) {
e.clearSelection();
toastr.success("Copied!");
});
$(".dataTables_length select").select2({
minimumResultsForSearch: Infinity
});
if(data.json.status == 0) {
Swal.fire({
title: "Error",
text: data.json.msg,
icon: "error"
})
}
}
});

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (1)

Hi,

Could you please clarify where the tooltip attached element that you hovered? Inside the datatable? To check the issue further we will need to reproduce the issue in our end.

Regards.

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(