Incompatibilité prototype / jQuery ($)

**Ghunter59** · 26/10/2009, 18h42

Bonjour,

Je suis actuellement en train de développer un site web sur lequel j'ai besoin d'utiliser jQuery (lightbox) et prototype en parallèle. Or, j'ai un problème : je n'arrive pas à utiliser correctement l'instruction jQuery.noXonflixt() et donc, je ne peux pas utiliser les deux correctement. Les erreurs que j'obtiens sont les suivantes :

Sous FF :

element.dispatchEvent(event);

(fonctionnement normal des lightbox et des appels prototype)

Sous IE :

erreurs (alert) au moment du chargement de la page et surtout, alert au moment du l'appel du lightbix ce qui empeche le fonctionnement du site...

Voici mon code JS et les inclusions de mes librairies :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
 
<script src="<?php echo $racine;?>/js/lib/prototype.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/lib/effects.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/lib/controls.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/lib/patch_inplaceeditor_1-8-2.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/lib/patch_inplaceeditor_editonblank_1-8-2.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/lib/tiny_mce/tiny_mce.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/lib/tiny_mce_init.js" type="text/javascript"></script>
<script src="<?php echo $racine;?>/js/src/inplacericheditor.js" type="text/javascript"></script>
 
<script type="text/javascript" src="<?php echo $racine; ?>/js/jquery.js"></script>
<script type="text/javascript" src="<?php echo $racine; ?>/js/thickbox.js"></script>
<link rel="stylesheet" href="<?php echo $racine; ?>/css/thickbox.css" type="text/css" media="screen" />
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></meta>
<link rel="shortcut icon" href="<?php echo $racine; ?>/images/favicon.ico"/>
 
 
<script type='text/javascript'>
	function showBox(racine){
		tb_init('a.thickbox, area.thickbox, input.thickbox');
		imgLoader = new Image();// preload image
		imgLoader.src = racine + "/images/loadingAnimation.gif";
		tb_showIframe();
		tb_show("Erreur !", "../admin/addPan.php?width=350&height=150", null);
	}
	function showBoxOk(racine){
		tb_init('a.thickbox, area.thickbox, input.thickbox');
		imgLoader = new Image();// preload image
		imgLoader.src = racine + "/images/loadingAnimation.gif";
		tb_showIframe();
		tb_show("Confirmation", racine + "/w/confirm.html?width=300&height=75", null);
		actualisePan(racine);
		return true;
	}
	function showBoxImg(racine, img){
		tb_init('a.thickbox, area.thickbox, input.thickbox');
		imgLoader = new Image();// preload image
		imgLoader.src = racine + "/images/loadingAnimation.gif";
		tb_showIframe();
		tb_show("Zoom", racine + "/w/imgZoom.php?width=400&height=355&img="+img, null);
	}
 
function styledPopupClose() {
 document.getElementById('styled_popup').style.display =  'none' ;
 document.getElementById('back').style.display =  'none' ;
}
function changeText(id, racine){
	document.getElementById('flag').value = id;
	new Ajax.InPlaceRichEditor(id, racine+"/admin/enregistrerBaseDeDonnees.php?v="+id, {}, tinymce_advanced_options);
}
function enregCat(id, racine){
	new Ajax.Request(racine+'/admin/enregistrerCat.php?v='+id, {
			parameters: {libelle:$('libelle').serialize(true)},
			onSuccess: function(t){
				if(t.responseText == '0'){
					document.getElementById('err').innerHTML="Une erreur est apparue lors de l'enregistrement de catégorie.";
				}else if(t.responseText == '1'){
					document.getElementById('err').innerHTML="Votre catégorie a été ajoutée avec succès.";
					var url = racine+"/w/crackers.php";
					var pars = "param1=valeur1";
					var target = "tableConteneur";
					var myAjax = new Ajax.Updater(target, url, {method: 'get', parameters: pars});
				}
			},
	});	
}
function montre(id){
	document.getElementById(id).style.display='block';
	document.getElementById('flag').value=1;
	return false;
}
function cache(id){
	document.getElementById(id).style.display='none';
	document.getElementById('flag').value=0;
	return false;
}
function show(id){
	if(document.getElementById('flag').value == 1){
		return montre(id);
	}else if(document.getElementById('flag').value == 0){
		return cache(id);
	}
}
 
function actualisePan(racine){
	var url = racine+'/admin/resPanier.php?v=1';
	var pars = 'total='+0;
	var target = "panier";
	var myAjax = new Ajax.Updater($(target), url, {method: 'post', parameters: pars,
		onSuccess: function(t){
			document.getElementById("panier").innerHTML = t.responseText;
		},
	});	
}
function addPan(racine, ref){
	new Ajax.Request('../admin/addPan.php?v=1', {
			parameters: {qte:document.getElementById('qte'+ref).value, ref:ref},
			onSuccess: function(t){
				if(t.responseText == '0'){
					showBoxOk(racine);
				}else{
					showBox(racine);
				}
			},
	});	
}
function checkOpenChart(){
	var news = document.getElementById('newsLetter').value;
	var email = document.getElementById('mail').value;
	new Ajax.Request('../admin/enregAdr.php?v=1', {
			parameters: {news:news, email:email},
			onSuccess: function(t){
				document.location.replace("../w/crackers.php?e=" + t.responseText);
			},
	});	
}
</script>

J'avoue que je ne sais pas du tout comment utiliser correctement le jQueryu.noConflict... j'ai deja essayé un certain nombre de possibilitées (trucs trouvés sur internet, etc) et rien ne fonctionne alors... je me tourne vers vous !

J'espere que vous pourrez m'aider !

Merci d'avance.

**gwyohm** · 26/10/2009, 19h16

Salut,

Dans ton cas, tu n'utilises jQuery que pour lightBox ? Si oui,le plus simple je pense c'est d'inclure
prototype puis jquery et juste apres de faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

jQuery.noConflict();

d'inclure lightbox et dans lightbox.js de remplacer tous les $( par jQuery(

**Ghunter59** · 26/10/2009, 19h18

Merci pour ta réponse !

Effectivement, je n'utilise jQuery que pour lightbox donc, je vais essayer de faire comme tu dis et je vous tiens au courant en fonction du résultat !

**Ghunter59** · 27/10/2009, 11h25

Hello !

Après tests, cette solution fonctionne parfaitement sous firefox mais sous IE, j'ai encore une erreur au moment du chargement de la page et aumoment de l'appel de ma lightbox...

Voici l'erreur au chargement de la page :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
Ligne 83
Erreur : identificateur, chaine ou nombre attendus.

Et voici celle à l'appel du lightbox :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
Ligne 188 :
Erreur : objet attendu.

En espérant que vous pourrez m'aider !

**gwyohm** · 27/10/2009, 11h42

Tu as surement quelque chose comme

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
,}

quelque part...

**Ghunter59** · 27/10/2009, 12h58

Effectivement c'était ça !

Merci beaucoup, ca fonctionne niquel maintenant !

Incompatibilité prototype / jQuery ($)

JavaScript

Discussions similaires

Partager

Partager