Threaded Mode | Linear Mode

Kao006

Hey All,

Been struggling with a mini/mega problem that I can't seem to find any solutions on.

I made two very simple files to show my problem "test.php" and "_testProfile.php":

test.php

HTML Code

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.js"></script>
<script type="text/javascript" src="./js/jquery.qtip-1.0.0.min.js"></script>
</head>
<body>
 
 
<div id="demo">
	<a href="#" rel="modal">Click me</a>
 
	<a href="#" rel="modal">Click me too!</a>
 
</div>
 
 
 
<script type="text/javascript">
 
$(document).ready(function() {
 
	$('a[rel=modal]').qtip({
		content: {
			title: {
				text: 'User Profile',
				button: 'Close'
			},
			url: '_testProfile.php',
			data: {uid: '2', user: 'Kao006'},
			method: 'get'
		},
		hide: false,
		api: {
			beforeShow: function() {
				this.loadContent(this.options.content.url, this.options.content.data, this.options.content.method);				
			}
		}
	});
});
</script>
</body>
</html>

_testProfile.php:

HTML Code

<html>
<head>
<link rel="stylesheet" type="text/css" href="./css/stylesheet.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.js"></script>
</HEAD>
<BODY>
 
<a href='#' id='sendClick'>Send message</a>
 
<div id='send'>
<form method="post" name="sendMessage">
<input type="text" name="message" id="message" size="50" value="">
<input type="submit" id="submit" value="Send It!">
</form>
</div>
 
<script type="text/javascript">
 
	$(document).ready(function() {
 
		$('#send').hide();
			$("#sendClick").click(function () {
			$("#send").toggle(500);
		});
	});
 
</script>
 
</BODY>
</HTML>

Now test.php simply has 2 links which displays the external page _testProfile.php. Now the _testProfile.php has a single link that works with Javascript to toggle through hide/show. What's weird is the Javascript only works on the *first* link that I click, then the next link will open the tooltip but the Javascript will no longer work. I've been wrapping my brain around this and can't seem to figure it out. Ultimately I'm going to have several links, each of which will pop up a tooltip, but if I can't seem to get 2 links to work, I don't see how I would proceed with generating several Smile

Any help is greatly appreciated, and I'm hoping it's not something "stupid" so forgive me if I've overlooked something simple

THANKS!!

***Craig***

You shouldn't really be sending <script> tags or any full HTML pages (with <html> and <body> etc) to the qTip. It can cause big problems especially with styling and all in all its just not good practice. This is probably also the reason why the JS isn't working.

Send a sub-sample of the page instead e.g. the form in your case I assume, without <head>, <body> etc. and move the script tag into a separate file linked to on the main page or similar.

Possibly Related Threads...
Thread:		Author	Replies:	Views:	Last Post
	[Solved] Dynamic Content From Page Element	frogg3862	2	89	3rd May 17:12 Last Post: frogg3862
	[Solved] Multiple qtips on one page, content disappearing	russau	3	121	3rd May 16:38 Last Post: Craig
	[Solved] Center tooltip on page and also use a thumb image to popup the real image	ChileCaliente	2	255	26th March 22:54 Last Post: ChileCaliente
	[Solved] One Target Multiple Tool Tips	rd42	1	267	19th February 18:24 Last Post: rd42
	[Solved] Styling links	phadley	4	389	17th February 17:46 Last Post: phadley
	[Solved] Jump to top of the page	snicker	4	1,306	15th February 03:31 Last Post: phpmysqlguy
	Tooltips not loading jQuery or other js files from parent document	crodesign	2	474	13th January 22:19 Last Post: crodesign
	[Solved] QTip content from existing div element on page?	dcash	4	2,519	8th December 18:29 Last Post: Craig
	[Solved] Positioning tooltip inside page	dmilne	1	501	30th September 14:56 Last Post: Craig
	[Solved] How to call javascript function within Qtip?	When2Meets2	7	1,118	19th September 16:49 Last Post: Craig