How can I append a ne DOM element into a bootstrap popover. I have to render a small charts, using Highcharts, which should be displayed into popover, so I cant use just a string for content attribute.
So the main problem is, how to get the popover element after $el.popover() was called.
you have to enable the html option of the popover instance, for example,
$('.popover-with-html').popover({ html : true });
You can do it with
$el.popover({
content: $('.chart')
})
where .chart is your chart (or whatever) element.
Related
Hi I have the following code at JSFiddle but the tooltip isn't being replaced by the text specified in JQuery's tooltip content option.
What am I doing wrong, misunderstanding or missing completely.
Thanks.
Html
<a id="linkB" href="#" data-toggle="tooltip" title="To Be replaced">Link with replaced content</a>
JS
$('#linkB').tooltip({content:'LinkB Tooptip replaced via text in the content option of tooltip'});
I first changed the title and then called tooltip which worked for me.
Let me know if you face the problem in this solution.
$('#table_row1').attr('title', "Replaced via text in the content option of tooltip").tooltip();
I've confused that you are using jquery-ui tooltip.
(You should remove jqueryuitag and add bootstrap, for other visitors.)
But after minutes, i realized you used bootstrap tooltip.
Anyway, solution is to use title option instead of content and also remove title attribute in html tag.
I append my jsfiddle
I am trying to render Ext.js tab panel to html div element.
tabpanel=Ext.create('Ext.tab.Panel',{
renderTo:,
items:[...]
}
My div element:
<div id="popup-content"></div>
In the place of renderTo property I tried with :
document.getElementById('popup-content')
Ext.getElementById('popup-content')
I even try to put only id tag 'popup-content'
Every time tab panel is rendered but it loses its functionality so I can't switch between tabs. When i try to render my tab with value of renderTo property set as:
Ext.getBody()
It works fine.
Any ides how to fix this?
hello i have this problem where i need to append a href tag with materialize modal inside it
so this is the code
<a href='#modalcreatechecklistitem' class='modal-trigger'>Add an item</a>
i have no problem when i just put it in my html
however, when i tried to append using jquery
$("#ajaxChecklist").append("<a href='#modalcreatechecklistitem' class='modal-trigger'>Add an item</a>");
it is not working
UPDATE :
class modal-trigger is not loaded, is this from jquery or my css?
it is working fine when i code in my html file
ANSWER:
jquery doesnt allow you to append a materialize class to an element.
To do this action, you need to re-initialize the materialize element or function
in this case, i did a function on the #modalcreatechecklistitem
the funtion will re-intialize the materialize modal and open the modal
you working is working fine, i just checked in fiddle also
https://jsfiddle.net/jvk3/8nfbxa1p/1/
may be you placed inside the table div or similar to parent
Two important questions:
1 - Is it code running in document.ready?
2 - Is there element with this id ajaxChecklist on the page?
I am trying to create a Bootstrap popup dynamically. I am using the following code but it does not show anything.
function showDictionaryPopup(term) {
// create popover div
var popoverDiv = $("<div>");
popoverDiv.attr("data-toggle","popover");
popoverDiv.attr("data-content","This is a test");
popoverDiv.addClass("row");
popoverDiv.popover();
$("body").append(popoverDiv);
}
I do not get any errors or anything..
Looks like you are appending the div to the DOM but never letting the popover be shown. Try calling popoverDiv.popover('show');
You may also want to add some content to the popover. All the available options can be found here: http://getbootstrap.com/javascript/#popovers
I have created a div using jquery and put some text in it:
var newdiv=$('<div id="content">').append('some text here');
$("#wrapper").append(newdiv);
Now I am trying to use the plugin masonry on the div.
I have added the following just below the above that creates the div:
$("#wrapper").masonry();
I have checked and jquery and masonry are loading correctly.
The new div called content shows in firebug correctly, but the masonry part is not doing anything to the new "content" div.
Any ideas?
Perhaps you should try adding 'appended':
var newdiv=$('<div id="content">').append('some text here');
$("#wrapper").append(newdiv);
$("#wrapper").masonry('appended', newdiv);
There's an append/prepend example here http://masonry.desandro.com/demos/adding-items.html