[AJAX] Quelle bibliothèque pour un champ d'autocomplétion fiable ?

Version imprimable

10/03/2014, 20h54
krunch

2 pièce(s) jointe(s)

[AJAX] Quelle bibliothèque pour un champ d'autocomplétion fiable ?

Bonjour

Je ne connais pas très bien les différentes bibliothèques disponibles, et j'ai commencé un projet avec les jQWidgets.
Tout allait bien jusqu'à ce que je tombe sur un os concernant l'autocompletion, qui fait que je cherche à la remplacer par une autre à cause d'une restriction que je trouve gonflante : dans le popup d'autocompletion l'ordre des items (celui de la réponse de la requête) n'est pas respecté, ils sont mélangés.

En l'occurrence il s'agit de villes et j'aimerais qu'elles soient classées par taille, ce que je fais dans la requête SQL. La requête d'autocompletion (jqx.dataAdapter) reçoit les items dans le bon ordre, mais le render du popup me les mélange.

Par exemple en tapant 'n' la réponse de la requête est Nice, Nantes, Nîmes, Nancy, Nanterre, Noisy-le-Grand, Neuilly-sur-Seine, Niort ... et voilà ce qu'il affiche : Pièce jointe 140193
Il s'agit d'une restriction de conception, on ne pas modifier cet ordre.

Quelqu'un pourrait il m'indiquer une biblio (si possible sur une base jquery) permettant de faire des Input avec autocompletion :
- qui ne mélange pas l'ordre des items
- qui permette de détecter si l'utilisateur a sélectionné ou pas un item (événement 'select')

Merci d'avance
11/03/2014, 09h26
Spartacusply

Hello !

Laisse moi deviner, tu développes sous chrome ?

J'ai eu exactement le même problème, en fait chrome (ou le plugin jquery sous chrome, je sais pas exactement) réorganise automatiquement le tableau en ordre croissant si les index sont numériques lors d'un parcours de ce tableau ! (oui c'est très chiant je te l'accorde bien volontiers). Je n'avais aucun problème sous les autres navigateurs.

La solution que j'ai trouvé pour contrer ce "bug", c'est d'encapsuler mes résultats dans un niveau de tableau supplémentaire, ce qui fait qu'il ne mélangeait pas les résultats à l'affichage.

Sinon pour le plugin a proprement parlé, pourquoi pas le widget jquery ui autocomplete ? Il est très simple de base mais peut-être étendu comme on le souhaite.
11/03/2014, 11h01
krunch

Ah, quelqu'un qui compatit :)

Non je suis sous FF (mais le but est d'avoir le même résultat partout), et ce problème vient du plugin apparemment.

J'ai demandé au support et il n'y aurait pas de solution (c'est là).
Voilà comment ça se passe :

Code:

$("#vdep").jqxInput({ placeHolder: "Code postal ou Ville", height: 23, width: 200, theme: theme, source: autocomp, renderer: function (itemValue, inputValue) { return itemValue; } });

La fonction 'autocomp' traite les items dans l'ordre de retour (qui est bon donc), la fonction du renderer reçoit aussi les items dans le bon ordre, mais le render les mélange ... à partir de là je ne vois pas quoi faire.

Merci, je vais me pencher sur jQueryUI. Si jamais tu as un bout de code sur ta méthode d'encapsulage je suis preneur...

C'est tout bête, je rajoutais un niveau à mon tableau php. Exemple :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$res = array(
    153 => 'aaaaa',
    15 => 'bbbb',
    2 => 'cccc',
    8 => 'dddd'
);
 
//Là si je fais rien, quand je parcourais ce tableau en js, chrome me les réorganise par index (ce que je ne veux absolument pas, ils sont déjà triés par ordre alphabétique !!)
 
//Pour éviter ça :
$resEncaps = array();
foreach ($res as $key => $value) {
    $resEncaps[] = array(
        'id' => $key,
        'value' => $value
    );
}
 
//Et hop voilà, j'ai un résultat encapsulé que chrome ne peut plus me mélanger.

14/03/2014, 17h59
krunch

ok ..
Alors j'ai essayé, mais du coup au niveau du retour de requête (dans 'loadComplete') je suis obligé d'extraire le résultat (en l'occurrence en écrivant item.value.VILLE au lieu de item.VILLE) sans quoi j'obtiens une suite de undefined ... Et du coup ça revient au même puisque le tri se fait après, dans le code du plugin ...

Bref, je retiens que ta solution fonctionne apparemment avec jQueryUI, mais au niveau de javascript il faut bien que tu extraies la valeur encapsulée (?)
14/03/2014, 18h06
Spartacusply

Bien sûr mais quand je parcours mon tableau avec une boucle each il me les réorganise pas dans le mauvais ordre étant donné que la les index du tableau sont toujours croissant. C'est ça la différence avec jquery ui, c'est que c'est toi même qui rempli ton autocomplete comme tu veux, c'est possible.
14/03/2014, 18h17
krunch

D'accord, ça marche différemment de jQWidgets (la boucle est dans le code du plugin)...

Finalement en en parlant je me suis dit qu'il suffisait de fouiller dans le code du plugin et de virer le foutu array.sort() planqué à l'intérieur ... Et ça marche !
Merci, tu m'as aidé indirectement !