Solved

How to use jquery no conflict?

Posted on 2015-01-06
6
335 Views
Last Modified: 2015-01-07
Hi,

I am trying to use two plugins that needs 2 different jquery versions.

1. The full calendar plugin, whose script is inside <head> , uses jquery.min.js
2. The tooltip plugin, whose script is inside <body>, uses jquery-1.3.2.min.js

How do i use jquery noconflict in this situation?  


<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<link href='../fullcalendar.css' rel='stylesheet' />
<link href='../fullcalendar.print.css' rel='stylesheet' media='print' />
<script type="text/javascript" src="../lib/jquery-1.3.2.min.js"></script>
<script src='../lib/moment.min.js'></script>
<script src='../lib/jquery.min.js'></script>
<script src='../fullcalendar.min.js'></script>
<script>
	$(document).ready(function() {
		$('#calendar').fullCalendar({
			events: {
				url: 'php/get-events.php',
				error: function() {
					$('#script-warning').show();
				}
			},
			loading: function(bool) {
				$('#loading').toggle(bool);
			}
		});

	});

</script>
</head>
<body>
<p>This is a paragraph.</p>

<div id="content" class="basic">
	<div class="center">
		<h2>The links below have a basic tooltip attached. Mouse over to see them.</h2>
		<p><a href="#">Lorem ipsum dolor</a></p>
		</div>
	</div>
	<div id='script-warning'>
		<code>php/get-events.php</code> must be running.
	</div>
	<div id='loading'>loading...</div>

	<div id='calendar'></div>


<script class="example" type="text/javascript">
	
	$(document).ready(function() {
		$('#content a[href]').qtip(
				{
					content: 'Some basic content for the tooltip' // Give it some content, in this case a simple string
				});
	});
</script>

<script type="text/javascript" src="../lib/jquery.qtip-1.0.0-rc3.min.js"></script>
</body>
</html>

Open in new window

0
Comment
  • 3
  • 2
6 Comments
 
LVL 37

Expert Comment

by:Neil Russell
ID: 40533127
" jquery.min.js"
What version is this?

What errors do you have if you ONLY include 1,3,2 ?

You need to explain what problem you have for us to answer it.
0
 
LVL 37

Accepted Solution

by:
Neil Russell earned 500 total points
ID: 40533131
Also qtip-1.0.0 is obsolete and you should be on qtip2
0
 
LVL 32

Expert Comment

by:Big Monty
ID: 40533543
use jQuery's noConflict() function

http://api.jquery.com/jquery.noconflict/
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 

Author Comment

by:NeverEndingFlashStories
ID: 40534480
Hi, thanks for the responses.  

So if i remove "jquery-1.3.2.min.js"
 i get the following error in console :
Uncaught TypeError: Cannot read property 'msie' of undefined      jquery.qtip-1.0.0-rc3.min.js:15 ajquery.qtip-1.0.0-rc3.min.js:15 f.fn.qtipjson.html:114 (anonymous function)
... and it keeps going down for more errors.

 If i remove  " jquery.min.js"
i get the following error in console :
Uncaught TypeError: undefined is not a function        fullcalendar.min.js:6 njquery-1.3.2.min.js:12 o.extend.eachfullcalendar.min.js:6
....and it keeps going down for more errors as well.

Basically, it looks like removing one will make the companion plugin stop working.
The jquery.min.js is packaged with fullcalendar.io , and when i open it, it says jquery 2.1.1

Thanks for the headsup, i will try qtip2 tonight.

Hi Big Monty, my original question was actually on how to use the noconflict() . I saw the page already, but i admit, i am a beginner at jquery, and while the explanation confuses me, i also can't seem to get it to work. I am not sure where to put the noconflict() line in.
0
 

Author Comment

by:NeverEndingFlashStories
ID: 40534989
qtip2 worked. Thanks for the advice.
0
 
LVL 37

Expert Comment

by:Neil Russell
ID: 40535207
Unless you have a specific need NOT TO, always check that you are on the latest version of plugins.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Xsl Nested Loop 4 26
XSLT 5 42
CSS: Element name is not scoping properly 4 73
Problem to picture file 3 68
Article by: Matthew
I am a very big proponent of technology compliance standards and strive to meet such criteria in all of my work. That includes my site, which is 100% XHTML 1.0 compliant as determined by the World Wide Web Consortium. https://www.matthewstevenkel…
Shoutout to Emily Plummer (http://www.experts-exchange.com/members/eplummer26.html) for giving me this article! She did most of it, I just finished it up and posted it for her :)    Introduction In a previous article (http://www.experts-exchang…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

920 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now