/* This would be the javascript for changing the '.fabrikTip' tooltips
* in all elements in a form that is using the bootstrap template.
* Include this code inside the requirejs(['fab/fabrik'], function ()
* in the form_xx,js file
*/
jQuery("div.fabrikElementContainer").each( function(){
// Initialize vars - set default options used for all matching objects
var title = "Tip Title"; // the tip heading
var content = "Click to continue"; // the tip content
var maxwidth = 276 // default popover width
var pos = "top"; // use "top" or "bottom"
// Change options for certain objects
if (jQuery(this).hasClass("fb_el_tablename___elementame")){
title = "Other Tip Title";
// The easiest way to edit the content is to use Chrome Developer Tools and cut and paste the html
// contents of the popover (inside the div.popover-content) here. Then edit the verbiage as desired.
// Or you can just write your own - no html tags are really needed.
content = '<ul class="validation-notices" style="list-style:none"><li><i data-isicon="true" class="icon-question-sign "></i> Enter the full name of the Org/Facility</li></ul>';
maxwidth = 287;
}
// Add a watch event that will show the tip using the options specified
jQuery(this).find("label.fabrikTip").mouseenter(function(el) {
jQuery("div.popover").css("max-width",maxwidth+"px");
jQuery("div.popover h3").text(title);
jQuery("div.popover-content").html(content);
// this can be used to reposition the popover should the
// height change because of a change in the width.
var position = jQuery(el.currentTarget).offset();
var newpos = position.top - (jQuery("div.popover-content").outerHeight() + 40);
jQuery("div.popover").css("top",newpos+"px")
});
});