Please Log-in or Register to get full access to the forums.


Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[Solved] Reload qtip with new items
10th October, 11:04
Post: #1
[Solved] Reload qtip with new items
Hi,
first of all, thanks for the plugin, it´s fantastic... Smile

My question...
I change content dinamically and when I load a new content that match with the jquery selector, tooltips not work...

For example:
HTML Code
JS Code
<div id="1" class="tooltip">Some content 1</div>
<div id="2" class="tooltip">Some content 2</div>
<div id="3">Some content 3</div>
 
<input id="add_class" type="button" value="Add Tooltip">


JS Code
JS Code
jQuery(document).ready(function() {
	$('.tooltip').each(function(){
		$(this).qtip({
			content: "String of the tooltip",
			show: 'mouseover',
			hide: 'mouseout'
		})
	})
 
	$("#add_class").click(function() { 
		$("#3").addClass("tooltip");
	});
});


When I click the button, the class it´s added correctly to the div, but the tooltip not show...
How can I "reinitialize" the tooltip for the new element??

P.D: I´m not english.. I hope explained well..Blush
Find all posts by this user
Quote this message in a reply
27th October, 00:09
Post: #2
RE: Reload qtip with new items
Randolf, you could use the .live() methods:

JS Code
jQuery(document).ready(function() {
   $('.tooltip').live('mouseover', function() { 
     // Make sure to only apply one tooltip per element!
     if( $(this).data('qtip') === 'object' ){ return; }
 
      $(this).qtip({
         content: "String of the tooltip",
         show: 'mouseover',
         hide: 'mouseout'
      });
   });
 
   $("#add_class").click(function() { 
      $("#3").addClass("tooltip");
   });
});
Visit this user's website Find all posts by this user
Quote this message in a reply
20th November, 13:43
Post: #3
RE: Reload qtip with new items
Sorry, I've been very busy.
I didn´t know the existence of the live() method.
It worked perfectly!!

Thanks very very much.
Find all posts by this user
Quote this message in a reply
8th April, 14:54
Post: #4
RE: Reload qtip with new items
A couple of updates on this -- I am dynamically refreshing a datatable and needed to have the qtips show up on the new lines. I needed to make a couple of changes to the following to make it work for all dynamically added items:

1) Changed the check on whether the tooltip exists by using typeof(), so it became:

if( typeof( $(this).data('qtip') ) == 'object' ){ return; }

2) The second problem is that although this created the qtip with the first mouseover, it didn't display it until the second mouseover. To address that, I added the following after the qtip call which forces a display after the qtip is added:

$(this).qtip('show');

Hope that helps!

daden

(27th October 00:09)Craig Wrote:  Randolf, you could use the .live() methods:

JS Code
jQuery(document).ready(function() {
   $('.tooltip').live('mouseover', function() { 
     // Make sure to only apply one tooltip per element!
     if( $(this).data('qtip') === 'object' ){ return; }
 
      $(this).qtip({
         content: "String of the tooltip",
         show: 'mouseover',
         hide: 'mouseout'
      });
   });
 
   $("#add_class").click(function() { 
      $("#3").addClass("tooltip");
   });
});
Find all posts by this user
Quote this message in a reply
Post Reply 


Possibly Related Threads...
Thread: Author Replies: Views: Last Post
  Reload from div tacotijsma 6 1,951 26th June 19:54
Last Post: tacotijsma
  [Solved] Add Reload to Button otti.steinhauer 3 1,424 29th February 19:31
Last Post: Craig
  [Solved] force dynamic content reload jackie135 6 4,992 13th March 20:59
Last Post: threadbaron
  [Solved] Reload a tooltip with a onClick steinfield 2 2,066 28th November 21:30
Last Post: Craig
  [Solved] qTips Stick Around After Reload ljarmin 1 1,408 2nd February 21:16
Last Post: Craig
  Swap tooltip without page reload lincolnporter 1 1,236 12th January 23:22
Last Post: Craig
  Parent Page Reload briandaly40 1 1,550 2nd September 14:14
Last Post: Craig



User(s) browsing this thread: 1 Guest(s)