Displaying HTML partial inside JQuery qtip2 popup -
i have large complicated informative popup display multiple cells within same column.
my initial attempt build html page , display within 'content' option within qtip2's jquery. find inline html option straight html. css additionally needs modified in original qtip2 download because not allow options in jquery beyond dimensions.
my jquery:
function initabbonamentitable(){ var content = $('<div class="popup">' + '<div class="title">' ); //etc long inline html $('.price-column').each(function(){ $(this).qtip({ content : content, //here i'd reference partial instead show: 'click', position: { my: 'top center', // position top left... at: 'bottom center', // @ bottom right of... target: $(this) // target }, style: { classes: 'custom' } }); });
the import line 1 correct, try:
content: ("@@import('../components/some/file_location.html')");
i have never tried myself, think can using ajax html.partial page, store jquery variable content
, , display way. refer answer returning ajax jquery variable: how return response asynchronous call?
or, go along first attempt, write out html need display <div>
somewhere on page, set style="visibility: hidden"
use jquery html , render out?
i made demo here: http://jsfiddle.net/o1hx267w/1/
it seems work, problem css within tooltip gonna b*tch
Comments
Post a Comment