Discussion :

[ZeRouxXx]

Bonjour à tous,
Voila j'utilise pour mon application struts, ibatis, j'ai récemment intégré DWR pour permettre l'auto complétion sur des champs de code postaux.
Mon auto complétion marche nickel, sauf que j'utilise prototype pour celle-ci, ce qui me fait planter certaines autres fonctionnalités car incompatible avec jquery (que j'utilise dans mon template).
J'ai donc cherché et trouvé qu'il existe une librairie sous jquery qui permette de faire ce que je veux aussi, ce qui me permettrait de corriger mon problème d'incompatibilité....
Sauf que, j'arrive pas à l'implémenter ! C'est donc là que j'ai besoin de votre aide

Je vous montre ce que j'ai pour l'instant :

ma jsp, ou l'on tape un code postal dans "zipcode", affiche la liste des propositions dans "zipcodelist" et complète la ville "town" lorsqu'on en sélectionne une

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type='text/javascript' src='<%= request.getContextPath()+ "/dwr/interface/AddressDWRFacade.js"%>'></script>
<script type='text/javascript' src='<%= request.getContextPath()+ "/dwr/engine.js" %>' ></script>
<script type='text/javascript' src='<%= request.getContextPath()+ "/dwr/util.js" %>' ></script>
<script type='text/javascript' src='<%= request.getContextPath()+ "/custom/script/module/autocomplete/prototype/prototype.js"%>'></script>
<script type='text/javascript' src='<%= request.getContextPath()+ "/custom/script/module/autocomplete/script.aculo.us/controls.js"%>'></script>
<script type='text/javascript' src='<%= request.getContextPath()+ "/custom/script/module/autocomplete/script.aculo.us/effects.js"%>'></script>
<script type='text/javascript' src='<%= request.getContextPath()+ "/custom/script/module/autocomplete/autocomplete.js"%>'></script>
 
<script type='text/javascript' src='<%= request.getContextPath()+ "/custom/script/module/autocomplete/jquery.autocomplete.js"%>'></script>
 
<html:text name="ContactForm" property="address.zipcode"  size="10" maxlength="32" styleId="zipcode" onblur="confirmZipcode();" />
<html:img page="/custom/script/images/loading.gif" border="0" alt="Loading" styleId="loadingZipcode" width="18" height="18" style="display: none ;" />
<div id="zipcodeList" class="auto_complete" style="position: relative;"></div>
<jsp:include flush="true" page="/custom/script/module/event/townParam.jsp"></jsp:include>

le fichier paramTown avec le code javascript

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
 
function updateZipcode<%= param %>List(autocompleter, token) 
	{
		document.getElementById('loadingZipcode<%= param %>').style.display = 'inline' ;
	 	AddressDWRFacade.getAllTownsWithZipcode(token, function(data) { autocompleter.setChoices(data) ; 
	 	document.getElementById('loadingZipcode<%= param %>').style.display = 'none' ; });
	}
 
	function zipcode<%= param %>ValueSelector(tag)
	{	
		return tag.zipcode + " " + tag.town + " " + tag.id ;
	}
 
	function confirmZipcode<%= param %>() 
	{
		document.getElementById('loadingZipcode<%= param %>').style.display = 'inline' ;
 
		var searchString = DWRUtil.getValue('zipcode<%= param %>');
		if(searchString.lastIndexOf(' ') == -1 )
			AddressDWRFacade.getTownWithZipcode(searchString,fillTown<%= param %>);
		else
			AddressDWRFacade.getTownWithId(searchString.substr(searchString.lastIndexOf(' ')+1, searchString.length),fillTown<%= param %>);
	}
 
	function fillTown<%= param %>(aTown) 
	{
		if(aTown != null)
		{
			document.getElementById('zipcode<%= param %>').value = aTown.zipcode ;
			document.getElementById('town<%= param %>').value = aTown.town ;
		}
 
		document.getElementById('loadingZipcode<%= param %>').style.display = 'none' ;		
	}
 
	new Autocompleter.DWR('zipcode<%= param %>', 'zipcode<%= param %>List', updateZipcode<%= param %>List,{ valueSelector: zipcode<%= param %>ValueSelector, partialChars: 0});

si quelqu'un peut m'aider, merci
si j'ai pas été assez précis, hésitez pas....

[Bovino]

j'utilise prototype pour celle-ci, ce qui me fait planter certaines autres fonctionnalités car incompatible avec jquery

Prototype et jQuery sont parfaitement compatibles, il suffit juste de préciser à jQuery que tu utilises Prototype :

Code :

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

jQuery.noConflict();

et utiliser la syntaxe jquery(...) au lieu de $(...).
Voir ici.

[ZeRouxXx]

oui j'avais essayé ça...
sauf que ca me fait des erreurs de ce type un peu partout dans les script prototype que j'utilise (en ayant bien remplacer les $() par jQuery() pour les parties concernées

Erreur*: $ is not a function
Fichier Source*: http://localhost:8080/eventmanager/c...e/prototype.js
Ligne*: 1510
Erreur*: $ is not a function
Fichier Source*: http://localhost:8080/eventmanager/c...us/controls.js
Ligne*: 40

**** update
ok en fait pas besoin de mettre le no-conflict comme prototype est chargé après, juste besoin de remplacer $()
tout marche....mais bon j'aurais quand même préféré utiliser aussi jquery pour l'automplete... tant pis !
du coup ce qui ne marchait plus avant remarche (logique), mais plus l'autocomplétion