Discussion :

[Pakkaï]

Bonjour à vous,

Après des recherches infructueuses sur le net, je viens ici vous exposer la fonction que je cherche à développer.

Voici donc la fonction je souhaite développer en Javascript :

Elément présent sur la page : un champ texte et la liste des communes de France en dessous affiché en liste
Contexte : dans un champ texte et au fur et à mesure de la saisie dans le champ
Fonction : retrouver les communes en recherche multi début de mot
Exemple :
Premier exemple : je tape ma première lettre "c" - toutes les villes commencant par "c" restent affiché, je continue ensuite avec les lettres "h" "a" "m" - toutes les villes commencant par "cham" reste affichées => complétion automatique
J'ai déjà développé cette fonction qui marche à merveille

Deuxième exemple : je tape toujours dans mon champs texte "cham" et ensuite "oi"

Code :

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

cham oi

je souhaite que ma fonction javascript puisse faire une recherche sur toutes les communes commencant par "cham", mais contenant aussi les mots commencant par "oi".

Le but étant de trouver la ville de Champapou oisifère ou celle de champigny sur oise (il faut en plus que la fonction ignore les particules)

Il existe bien sur d'autres techno pour le faire, mais je suis contraint de le faire en Javascript.

Avez vous des suggestions ou des pistes ?

Merci

[Djakisback]

Salut,
en plus de ton test sur le début de chaîne tu peux ajouter :

Code :

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

1
2
3
4
var keyword = "oi";
if(str.indexOf(keyword, 0) == -1) {
// Tu supprimes l'option
}

Bye

[Pakkaï]

Bonjour,

Merci pour cette réponse. Mais elle ne fonctionne que sur des variables bien précise. Dans ton exemple

Code :

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

var keyword = "oi";

Hors j'ai une liste de 32 750 communes avec des noms composés, donc je ne peux pas déclarer tous les variables possible et imaginable. En plus que tous les noms de villes ne sont pas en noms composés.

D'autres pistes ?

Merci

[Bisûnûrs]

Une RegExp en plus de ton code ?

Genre :

Code :

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

/\soi/i

[cerede2000]

Ben le probleme de la RegExp est que ca sortira tout les mot contenant "oi" par exemple :S La chose que tu veut faire demanderai un traitement enorme...
Parce que il faudrait prendre les mot commençant par "cham" les complété et regarder ensuite si il existe une suite a ces mot qui contienne "oi"

[Bisûnûrs]

Ben le probleme de la RegExp est que ca sortira tout les mot contenant "oi" par exemple :S La chose que tu veut faire demanderai un traitement enorme...
Parce que il faudrait prendre les mot commençant par "cham" les complété et regarder ensuite si il existe une suite a ces mot qui contienne "oi"

Sauf que dans ma RegExp je vérifie qu'il y a un espace avant la chaîne "io" ... Donc c'est forcément le début d'un mot.

[Pakkaï]

Pour que l'on puisse avoir un exemple concret voici un fonctionnement quasi complet de ce que je cherche :

http://www.ratp.fr

Dans les boutons radio sélectionnez "Station", puis faites une saisie dans le champ texte.

Je cherche la station "Noisy-le-grand - Mont d'Est".
En tapant "Noi" on se retrouve avec 7 stations et ma station est incluse. Ca c'est nickel.

Maintenant si je tape "Noi gra" pour trouver "Noisy-le-grand - Mont d'Est" ça ne marche pas
=> c'est cette fonction que je veux créer.

Merci

[Bisûnûrs]

Code :

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

1
2
3
function fonctionDExpressionReguliere(texte, param) {
   return /\sparam/i.test(texte) ;
}

Retourne true dans le cas où c'est vérifié, false sinon.

http://jacques-guizol.developpez.com...Exp/RegExp.php

[Djakisback]

J'ai dû rater un truc
T'as une fonction qui filtre les communes sur le 1er mot-clé
Il te reste juste à filtrer parmi celles qui restent si elle contiennent les autres mot-clés.

En gros tu fais un explode en utilisant les espaces du champ des mot-clés, le 1er résultat du tableau va servir à filtrer le début des communes et les autres à filtrer ces dernières en fonction de si elles contiennent ou non les mot-clés.

L'algo c'est bien ?
keywords[0] = 'Noi'
keywords[1] = 'gra'
"résultat qui commence par keywords[0] et qui contient keywords[1], keywords[2], etc."

[Pakkaï]

L'algo c'est bien ?
keywords[0] = 'Noi'
keywords[1] = 'gra'
"résultat qui commence par keywords[0] et qui contient keywords[1], keywords[2], etc."

Djakisback

C'est bien cela

Tu as une piste à me donner par rapport à l'algo ? Es tu ok avec les RegExp ?

Merci

[Djakisback]

Salut,
bin en fait le plus simple est de faire comme je disais dans mon premier post, tu ajoutes un test avec str.indexOf() à ton test de début de chaîne.

Si tu optes pour les regex un truc comme ca devrait le faire :

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
 
<script>
var str = "Noisy-le-grand - Mont d'Est";
var keywordStr = "Noi gri";
 
var keywords = keywordStr.split(new RegExp("[ ]+", "g"));
var pattern = "^" + keywords[0];
for(var i = 1; i < keywords.length; i++)	{
	pattern += ".*" + keywords[1];
}
pattern += ".*$";
 
var reg = new RegExp(pattern, "gi");
 
if(reg.test(str) == true) {
//tu laisses l'option
}
else {
// tu supprimes
}
</script>

Bye

[cerede2000]

Au faite juste en passant ta liste elle est stocké ou dans un fichier?
http://bbjess.free.fr/bd/req.php

[Pakkaï]

Au faite juste en passant ta liste elle est stocké ou dans un fichier?
http://bbjess.free.fr/bd/req.php

Salut,

Et bien ma liste est dans le fichier js avec le code de complétion

voici un extrait de la forme de stockage du fichier :

Code :

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

var listeCommunes = "|01000;AAST|01001;ABAINVILLE|01002;ABANCOURT|01003;ABANCOURT|01004;ABAUCOURT|01005;ABAUCOURT-HAUTECOURT|01006;ABBANS-DESSOUS|01007;ABBANS-DESSUS|01008;ABBARETZ|

Au passage, le lien que tu m'as passé est excellent. C'est ce que je cherche à faire, quand je tape "noi gra" et envoyer il me retourne le bon résultat. Maintenant je dois faire ça en javascript et non en php

Merci

[cerede2000]

Ce que je t'ai passe c'est de moi
Si jamais tu trouve ton script m'interesse

[Pakkaï]

c'est casse gueule.
Je m'en sors pas avec les différentes méthodes que vous me proposez.

Voici un extrait de mon code. Pouvez vous m'aider et me dire comment mettre en place les différents type de code ?

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
function completionLibelleCommune(valeur) {
	result ="";
	valeur = valeur.toUpperCase();
	idx = listeCommunes.indexOf(";" + valeur);
	compteurAffichage = 0;
	while (idx != -1) {
		idx2 = listeCommunes.indexOf("|",idx+1);
		idx3 = listeCommunes.lastIndexOf("|",idx-1);
		result += listeCommunes.substring(idx +1,idx2) + " (" + listeCommunes.substring(idx3+1,idx) + ")<br>";
		idx = listeCommunes.indexOf(";" + valeur,idx2 + 1);
		compteurAffichage += 1;
		if (compteurAffichage == 100) idx = -1;
	}
	return result;
}
 
var listeCommunes = "|01000;AAST|01001;ABAINVILLE|01002;ABANCOURT|";

Merci

[Djakisback]

Salut,
il faudrait voir le bout de code où tu modifies dynamiquement la liste multiple.

[Pakkaï]

Je ne pense pas que cela aidera davantage, mais bon on sait jamais

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
<script language="javascript" type="text/javascript" src="script.js"></script>
 
<script language="javascript">		
	function recup(){
	creerDiv(completionLibelleCommune(document.getElementById('completion_text').value));
			}
	}
 
	function creerDiv(tab) {
		document.getElementById("donnees").innerHTML = tab;		
	}		
</script>
 
<input type="text"
class="texte"
id="completion_text"
name="completion_text"
onkeyup="recup();">
 
<div id="donnees">
	</div>

[Djakisback]

En fait je vois que ta fonction détecte pas le début de chaîne mais elle cherche le mot-clé dans toute la chaîne ? (t'utilises listeCommunes.indexOf(";" + valeur); donc que 'Noi' soit en début de chaîne ou au mileu Noisy va apparaître.), donc effectivement tu peux pas ajouter simplement un autre indexOf().

Voilà une soluce avec les regex, si tu comprends pas quelque chose, hésite pas :

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
datas = listeCommunes.split(new RegExp("\\|", "g"));
 
function completionLibelleCommune(valeur) {
	result ="";
	valeur = valeur.toUpperCase();
	reg1 = new RegExp("[ ]+", "g");
	keywords = valeur.split(reg1);
 
	// Création du motif
	pattern = "^" + keywords[0];
	for(i = 1; i < keywords.length; i++)	{
		pattern += ".*" + keywords[1];
	}
	pattern += ".*$";
	reg2 = new RegExp(pattern, "gi");
 
	reg3 = new RegExp(";", "g");
	// Parcours du tableau
	for(i = 0; i < datas.length; i++)	{
		commune = datas[i].split(reg3);
		if(reg2.test(commune[1]))	{
			result += commune[1] + " (" + commune[0] + ")<br/>";
		}
	}
	return result;
}

Faut voir si c'est pas trop lent avec le tableau entier.

[Pakkaï]

Djakisback,

C'est... nickel ... mais pas pour les 36 720 lignes lol. Fallait s'y attendre, les perf sont pas top, je tourne au alentours de 15-20 secondes voir plus des fois pour qu'il me trouve ce que je cherche.
En faite sur la grande liste ça rame c'est normal comme j'ai mis les données dans une seule et unique variable. Est il possible d'optimiser le code à votre avis ?

Sinon bonne nouvelle, ça marche nickel quand je réduit ma liste des communes (je rappel, dans une variable) à 10 000, c'est pas mal.

Donc est il possible d'optimiser les perf en faisant autrement ?

Merci encore à tous.

[cerede2000]

Et bien pour augmenter les perfs il faut te tourné vers une solution BDD avec une page php qui fait une requête SQL ou autre et qui te renvoit un nombre limité de résultats