Skip to content

Instantly share code, notes, and snippets.

@m8rge
Last active September 8, 2020 10:20
Show Gist options
  • Save m8rge/61929a6c356349bf080c to your computer and use it in GitHub Desktop.
Save m8rge/61929a6c356349bf080c to your computer and use it in GitHub Desktop.
twitter bootstrap tooltip over select2
/**
* Declate title attribute on target select element.
* Initialize tooltip:
*/
jQuery("div.select2-container").tooltip({
title: function() {
return $(this).next().attr("title");
},
});
@hughlaw
Copy link

hughlaw commented Nov 11, 2014

You sir, are a lifesaver! Thanks!

@lanrosta
Copy link

This does not work on select2's that use the ajax option to load your select2 data. This is because the ajax method (returns a div) does not use the same DOM nodes as a non-ajax select2 (returns a select) to create the select2. Anyone have code that supports tooltips on ajax-based select2's?

@mindaugas-lt
Copy link

Using the latest bootstrap and select2. I can't get it working properly, it only works if I remove "div" and define "title" manually. However, defining title manually isn't a solution. Could someone help on this?

$(".select2-container").tooltip({
    title: "abc",
});

@pyriel4you
Copy link

Using tooltip semantic on the select element:
$("span.select2.select2-container").tooltip({
title: function() {
var title = $(this).prev().attr("data-original-title");
return title;
}
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment