Discussion :

[Soobook]

Bonjour à tous,

J'utilise un autocomplete avec une "Remote JSONP datasource" (quasi identique à cette doc JQuery).
Cela me sert à chercher un utilisateur pour accéder à sa fiche ou à en créer un. Pour cela j'insère au début de ma liste de résultats (dans le JSON) une entrée "Nouveau...".

Tout ça marche très bien, mais si je veux créer un nouvel utilisateur je suis obligé de taper quelque chose pour afficher les résultats.
J'aimerai, au focus sur le champ de recherche, ouvrir la liste de suggestion apparaisse avec juste mon entrée "Nouveau..." et j'arrive pas à le faire.

Voila, je sais pas si je suis très clair. Ci-dessous mon code JS.

Merci d'avance à ceux qui pourront me mettre sur la voie.

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
    $("#tags").autocomplete({
        minLength: 2,
        source: function(req, add){
        $.getJSON("modules/accueil/rechercheRpc.php?callback=?", req, function(data) {
            var suggestions = [];
            $.each(data, function(i, val){
                suggestions.push({
                    "id": val.id,
                    "libelle": val.libelle
                    });
                });
            add(suggestions);
            });
        },
        select: function(e, ui) {
        $("#id_patient").val(ui.item.id);
        var page = (ui.item.id == 0) ? "index.php?module=patient&action=edition_patient" : "index.php?module=patient&action=patient";
        $("#recherche_patient").attr("action", page);
        $("#recherche_patient").submit();
        },
        change: function() {
        $("#tags").val("").css("top", 2);
        }
        }).data( "autocomplete" )._renderItem = function( ul, item ) {
        return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a style='font-size: 80%;'>" + item.libelle + "</a>" )
        .appendTo( ul );
    };

[Soobook]

Bon, J'ai viré mon message précédent, c'était n"importe quoi.

J'ai trouvé une manière simple de faire ce que je veux :

Code :

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

1
2
3
4
 
    $("#tags").focus(function(){
        $("#tags").autocomplete( "search" , "" );
    });

J'ai adapté ma source de données pour "limiter les dégâts", mais le problème de cette solution est qu'un appel inutile lui est fait chaque fois qu'on entre dans le champ.

Il doit être possible de faire ça mieux en ajoutant un élément grâce à ".autocomplete("option" , optionName , [value])" puis en affichant la liste, mais j'arrive à rien...

[Soobook]

Bon, cette fois ci je crois que c'est bon.

Tout se passe au niveau de la source de données :

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
 
$("#tags").autocomplete({
    minLength: 2,
    source: function(req, add){
    var suggestions = [];
    //J'insère ma ligne par défaut...
    suggestions.push({
        "id": 0,
        "libelle": "NOUVEAU PATIENT"
        });
    add(suggestions);
    //S'il faut faire une requete, et ben on la fait...
    if(req != "creer_nouveau_patient") {
    $.getJSON("modules/accueil/rechercheRpc.php?callback=?", req, function(data) {
        $.each(data, function(i, val){
            suggestions.push({
                "id": val.id,
                "libelle": val.libelle
                });
            });
        add(suggestions);
        });
    }
    },
    select: function(e, ui) {
    $("#id_patient").val(ui.item.id);
    var page = (ui.item.id == 0) ? "index.php?module=patient&action=edition_patient" : "index.php?module=patient&action=patient";
    $("#recherche_patient").attr("action", page);
    $("#recherche_patient").submit();
    },
    change: function() {
    $("#tags").val("").css("top", 2);
    }
    }).data( "autocomplete" )._renderItem = function( ul, item ) {
    return $( "<li></li>" )
    .data( "item.autocomplete", item )
    .append( "<a style='font-size: 80%;'>" + item.libelle + "</a>" )
    .appendTo( ul );
};

Ensuite il suffit de faire ça :

Code :

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

1
2
3
4
 
$("#tags").focus(function(){
    $("#tags").autocomplete("search" , "creer_nouveau_patient");
});

Et voila. J'espère que ça pourra aider quelqun....