Discussion :

[oceanbigone]

Bonjour,

J'utilise l' autocompleter local (sans AJAX)de scriptaculous.
je souhaiterai le rendre insensible aux accents. Pour l'instant, je fait simplement un double des mots sans accents dans mon tableau de départ:

Code :

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

1
2
3
4
 
var aListeProduits=new Array();
aListeProduits.push('éléphant');
aListeProduits.push('elephant');

Cela fonctionne mais pose deux problèmes.
1/ On voit la version sans accents dans les choix proposés.
2/ Si on tape "éle", on a plus rien.

donc voici mes questions :
1/ Est-ce que scriptaculous a prévu le coup (rien vu dans la doc pour ça) ?
2/ Est-ce que quelqu'un connait un moyen simple d'y parvenir (meme si je dois prendre un autre autocompleter) ?


Voila...

Merci d'avance

[SpaceFrog]

à mon avis faudra passer par une chaine temporaire ou tu auras remplacé les accents en passant par une regExp

[oceanbigone]

Merci, je pensais à ça ausis..mais je vois pas bien comment l'utiliser avec le fonctionnement de scriptaculous. je pense que l'idéal serait de modifier directement la fonction de recherche de scriptaculous.

Je vais regarder ça... mais le hic..quand on fait ça..c'est qu'il faudra que je retourne appliquer ma modification a chaque mise à jour de scriptaculous.

Du coup je suis toujours preneur pour une autre piste ?

[SpaceFrog]

tu peux ajouter une fonction dans un fichier externe ...

[oceanbigone]

Merci pour votre aide ..

J'ai utiliser le code de base de scriptaculous pour reecrire une fonction selector personnalisée... cela fonctionne à merveille

J'initialise le tableau de données avec deux colonnes, l'une avec accents l'autre sans accents.
Lors de la recherche, je convertis la chaine recherchée en une version sans accent et je la compare à la version sans accent de mon tableau. Je continue cependant à afficher la version avec accents dans mon aide à la saisie.

Vous trouverez ci-dessous le code que j'ai utilisé (si ça peut servir)

HTML :

Code :

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

1
2
3
 
//mon champ 
<input type="text" autocomplete="off" id="addProduit" name="addProduit"  class="saisie" />

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
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
 
//exemple d'un tableau de donnees a faire passer avec deux colonnes [0]=le champs normal et [1]=version sans accents
var aListeProduits=new Array();
aListeProduits.push(Array('éléphant','elephant')); 
aListeProduits.push(Array('été','ete'));
aListeProduits.push(Array('table','table')); 
 
//fonction de scriptaculous a appeler
monSelector=function (instance) { //fonction de selection des resultat de l'autocompleter
 
        var ret       = []; // Beginning matches
        var partial   = []; // Inside matches
        var entry     = instance.getToken();
        var count     = 0;
 
        entry=noaccent(entry);
 
        for (var i = 0; i < instance.options.array.length &&
          ret.length < instance.options.choices ; i++) {
 
          var elem = instance.options.array[i][1];
		   var elemDisplay = instance.options.array[i][0];
          var foundPos = instance.options.ignoreCase ?
            elem.toLowerCase().indexOf(entry.toLowerCase()) :
            elem.indexOf(entry);
 
          while (foundPos != -1) {
            if (foundPos == 0 && elem.length != entry.length) {
              ret.push("<li><strong>" + elemDisplay.substr(0, entry.length) + "</strong>" +
                elemDisplay.substr(entry.length) + "</li>");
              break;
            } else if (entry.length >= instance.options.partialChars &&
              instance.options.partialSearch && foundPos != -1) {
              if (instance.options.fullSearch || /\s/.test(elem.substr(foundPos-1,1))) {
                partial.push("<li>" + elemDisplay.substr(0, foundPos) + "<strong>" +
                  elemDisplay.substr(foundPos, entry.length) + "</strong>" + elem.substr(
                  foundPos + entry.length) + "</li>");
                break;
              }
            }
 
            foundPos = instance.options.ignoreCase ?
              elem.toLowerCase().indexOf(entry.toLowerCase(), foundPos + 1) :
              elem.indexOf(entry, foundPos + 1);
 
          }
        }
        if (partial.length)
          ret = ret.concat(partial.slice(0, instance.options.choices - ret.length));
        return "<ul>" + ret.join('') + "</ul>";  
      }
 
//fonction pour enlever les fonctions (ya surement mieux..)
function noaccent(chaine) {
  temp = chaine.replace(/[àâä]/gi,"a")
  temp = temp.replace(/[éèêë]/gi,"e")
  temp = temp.replace(/[îï]/gi,"i")
  temp = temp.replace(/[ôö]/gi,"o")
  temp = temp.replace(/[ùûü]/gi,"u")
  return temp
}

INITIALISATION SCRIPTACULOUS :

Code :

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

1
2
3
 
//initialisation de l'autocompleter sur le champ :
new Autocompleter.Local('addProduit', 'listeproduits', aListeProduits,{selector:monSelector});