+ Répondre à la discussion Actualité déjà publiée
  1. #1
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    11 450
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 11 450
    Points : 24 238
    Points
    24 238

    Par défaut [Article] Créer des listes déroulantes liées entre elles sans utiliser Ajax

    Bonjour,

    Je vous propose un article : Créer des listes déroulantes liées entre elles sans utiliser Ajax.

    Dans celui-ci, nous allons voir comment lier des listes déroulantes, <select>, entre elles sans faire appel à des requêtes serveur de type Ajax, tout se passe donc côté client.

    L'approche que je vous propose est une approche s'appuyant sur une pseudobase de données facile à maintenir associée à une fonction de recherche.

    N'hésitez pas à faire part de vos remarques ou commentaires concernant cet article.

    Bonne lecture.

    Créer des listes déroulantes liées entre elles sans utiliser Ajax.



    Les meilleurs cours et tutoriels pour apprendre la programmation JavaScript
    Les meilleurs cours et tutoriels pour apprendre la programmation Web

  2. #2
    Rédacteur/Modérateur
    Avatar de jreaux62
    Homme Profil pro
    Webdesigner
    Inscrit en
    août 2008
    Messages
    9 631
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 50
    Localisation : France, Pas de Calais (Nord Pas de Calais)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Arts - Culture

    Informations forums :
    Inscription : août 2008
    Messages : 9 631
    Points : 19 290
    Points
    19 290

    Par défaut

    Bonjour NoSmoking,

    D'abord : très bon article !

    1/ Grosse coquille !!
    ce n'est pas la région "Haut de France" mais "Hauts de France" (on est plusieurs ! )

    2/ (plus sérieux)
    ne faudrait-il pas mettre en titre "...listes liées en cascade..." (ou un truc du genre)
    UNE liste étant liée à UNE SEULE autre "parente" ?

    Sauf erreur (car j'ai lu vite fait), tu ne traites pas d'une liste dépendant (par exemple) de DEUX ou PLUSIEURS autres listes.

    Ex. : liste de véhicules dépendant de :
    • modèle
    • année
    • couleur
    • ...


    A moins que ce soit le sujet d'un autre article ?

    3/ il existe dans la FAQ JavaScript : Comment lier deux listes déroulantes entre elles ?
    Je n'ai pas vu de lien dans l'article...

    A voir aussi : http://www.developpez.net/forums/d59...s-liees-entre/
    "Si tu suis le chemin qui s'appelle « plus tard », tu arriveras à la place qui s'appelle « jamais »."
    François Camille Prévot (1910-1996), instituteur puis Directeur d'école et... mon grand-père.
    "Ce qui se conçoit bien s'énonce clairement. Et les mots pour le dire arrivent aisément."
    Nicolas Boileau-Despréaux (1636-1711).
    Mes tutos DVP
    Gestion-Affichage de Nouvelles
    Affichage en tableau HTML
    Fonctions de redimensionnement d'images

  3. #3
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    février 2009
    Messages
    5 591
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 66
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : février 2009
    Messages : 5 591
    Points : 20 189
    Points
    20 189
    Billets dans le blog
    36

    Par défaut

    Il y a aussi le département du "Creuset" au lieu du département de la "Creuse".

    Si les erreurs ont été commises par l'INSEE, c'est encore plus grave.

    Blog



    Nota bene : si vous devez être compatible avec les navigateurs obsolètes (IE8 et plus), vous devez convertir les codes ES2015 en ES5 avec Babel.

    FAQ JS Tutoriels JS

    Si un message vous a aidé ou vous semble pertinent, votez pour lui !

  4. #4
    Expert éminent sénior

    Avatar de Francis Walter
    Homme Profil pro
    Développeur informatique
    Inscrit en
    février 2012
    Messages
    2 318
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Bénin

    Informations professionnelles :
    Activité : Développeur informatique
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : février 2012
    Messages : 2 318
    Points : 26 494
    Points
    26 494

    Par défaut

    Bonjour,

    J'ai fait une lecture rapide et je trouve l'article bien.
    Je vais profiter de cette discussion pour partager une méthode que j'ai l'habitude d'utiliser en manipulant les éléments optgroup du select :
    (J'ai utilisé du JQuery)
    Code HTML : 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
     
    <html>
        <head>    
            <meta charset="UTF-8" />
            <title>Test</title>
    		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
        </head>
        <body>
            <div>
                <label for="countries" class="required">Pays :</label>
                <select id="countries" name="countries" content-type="choices" trigger="true" target="department">
                    <option value="1" >France</option>
                    <option value="2" >Bénin</option>
                </select>
            </div>
            <div>
                <label for="department" class="required">Départements :</label>
                <select id="department" name="department" >
                    <optgroup reference="1">
                        <option value="1" >Côtes d'amor</option>
                        <option value="2" >Finistère</option>
                        <option value="3" >Île-et-Vilaine</option>
                        <option value="4" >Morbihan</option>
                    </optgroup>
                    <optgroup reference="2">
                        <option value="5" >Littoral</option>
                        <option value="6" >Collines</option>
                        <option value="7" >Atlantique</option>
                        <option value="8" >Zou</option>
                    </optgroup>
                </select>
            </div>
            <script> /* Insérer le code JavaScript ici */ </script>
        </body>
    </html>

    Code JavaScript : 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
     
    /*
      * trigger="true" permet de dire que c'est l'élément le plus haut qui fait varier toutes les autres listes
      * target=[id_cible] permet de spécifier la liste qui doit varier au changement de la sélection
      * reference=[id_reference] est l'id de l'élément parent qui déclenche la mise à jour de la liste
    */
     
    //Fonction qui s'occupe de la mise à jour des listes
    function updateSelectBox(object){
        // Object correspond au input qui déclenche l'action (pays dans notre cas)
        // On récupère le select (département) qui doit être mise à jour suite au changement du parent (pays)
        var target = $("#"+object.attr('target'));
     
        // On récupère tous les optgroup du select cible spécifié avec target (les optgroup du select département)
        var listGroups = target.find("optgroup");
     
        // On récupère le optgroup qui correspond à la valeur courante du select parent (pays)
        var validGroup = target.find("optgroup[reference='"+object.find(':selected').val()+"']");
     
        //On modifie la valeur courante du select cible (département)
        target.val(validGroup.find("option").val());
     
        //On cache tous les optgroup de département
        listGroups.hide();
     
        //On affiche uniquement le optgroup de département qui correspond à la valeur courante de pays
        validGroup.show();
     
        //On vérifie si la cible (département) doit déclencher une mise à jour d'une autre liste
        // Département peut par exemple déclencher la mise à jour des villes, et les villes déclenches celle des quartiers...
        if(target.attr('content-type')=='choices')
            target.change();
    }
     
    //On associe la fonction updateSelectBox à l'événement onchange des listes qui doivent déclencher des mises à jour d'autres listes
    $("select[content-type='choices']").on('change',function(){
        updateSelectBox($(this));
    });
     
    //On fait la première mise à jour des
    $(document).ready(function(){
        updateSelectBox($("select[trigger='true']"));
    });

    Si par exemple vous souhaitez ajouter les villes, il suffira d'ajouter un autre bloc select pour les villes, de renseigner son id à l'attribut target de département comme ceci :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    <div>
        <label for="town" class="required">Villes :</label>
        <select id="town" name="town" content-type="choices">
            <optgroup reference="1"> <!-- 1 correspond à la valeur du département Côtes d'amor -->
                <option value="1" >Ville machin</option>
                <option value="2" >Ville consor</option>
            </optgroup>
            <optgroup reference="5"> <!-- 5 correspond à la valeur du département Littoral -->
                <option value="4" >Cotonou</option>
            </optgroup>
        </select>
    </div>

    Maintenant faut pas oublier de dire au select de département de faire varier les villes au changement en ajoutant content-type="choices" et target="town"Vous pouvez voir un petit démo ici : http://francis-walter.developpez.com...-without-ajax/
    Vous avez envie de contribuer au sein du Club Developpez.com ?

    Vous êtes passionné, vous souhaitez partager vos connaissances en informatique, vous souhaitez faire partie de la rédaction.
    Il suffit de vous porter volontaire et de nous faire part de vos envies de contributions :
    Rédaction d'articles/cours/tutoriels, Traduction, Contribution dans la FAQ, Rédaction de news, interviews et témoignages, Organisation de défis, de débats et de sondages, Relecture technique, Modération, Correction orthographique, ...etc.
    Vous avez d'autres propositions de contributions à nous faire ? Vous souhaitez en savoir davantage ? N'hésitez pas à nous approcher.

  5. #5
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    11 450
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 11 450
    Points : 24 238
    Points
    24 238

    Par défaut

    Bonjour à tous et merci pour vos retour.
    ce n'est pas la région "Haut de France" mais "Hauts de France"
    je n’avais pas corrigé le bon fichier, par contre Daniel.
    Il y a aussi le département du "Creuset" au lieu du département de la "Creuse".
    celle là je ne me l'explique pas mais je te rassure cela ne provient pas de l'INSEE .

    C'est corrigé dans la mise à jour.


    Jérôme, pour en revenir à tes autres remarques
    ne faudrait-il pas mettre en titre "...listes liées en cascade..." (ou un truc du genre)
    Les listes liées sont toutes en « cascade » l'une entrainant l'autre c'est peut être juste la présentation qui donne un peu plus cette impression.
    Un autre point est que souvent, lorsqu'il n'y a qu'un choix possible, on est quand même obligé de le sélectionner sur un bon nombre de site alors que dans mon exemple je le sélectionne par défaut ce qui fait que l'enchainement sur la liste suivante est réalisé.

    tu ne traites pas d'une liste dépendant (par exemple) de DEUX ou PLUSIEURS autres listes.
    le principe est le même et il suffit juste de faire abstraction du type de données pour voir que l'on est dans un schéma classique.

    Imaginons que
    • nouvelle région soit modèle ;
    • ancienne région soit année ;
    • département soit couleur.
    on retrouve bien le même schéma.

    3/ il existe dans la FAQ JavaScript : Comment lier deux listes déroulantes entre elles ?
    Je n'ai pas vu de lien dans l'article...
    C'est prévu lorsque la mise à jour de la faq sera effective, car l’exemple actuel fourni ne me convient pas franchement, on en avait parlé ici Les formulaires (partie 2) Comment lier deux listes déroulantes entre elles ?

    Quant au dernier lien que tu mets il ne m'a pas semblait opportun de le mettre car utilisant justement l'Ajax, donc difficile à introduire. De plus ce lien est épinglé ce qui en fait un incontournable.

    Francis ton approche est pas mal non plus et tu fais bien de profiter de l'occasion pour nous en faire cadeau, cela fera une alternative de plus.

  6. #6
    Membre confirmé
    Homme Profil pro
    nop
    Inscrit en
    mars 2015
    Messages
    436
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : nop
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : mars 2015
    Messages : 436
    Points : 620
    Points
    620

    Par défaut ça devrait être enseigné !

    j'approuve totalement cette démarche. ça devrait être un exercice de base pour tous ceux qui apprennent le javascript.
    Avant de savoir le faire avec ajax, on doit savoir le faire sans (on doit même savoir le faire en algorithme même avant)

    Pourquoi utiliser ajax quand on peut s'en passer!?

    Le gain en terme de performance côté client est total, sans parler de l'expérience utilisateur qui est merveilleuse avec cette instantanéité alors qu'avec ajax on est sans arrêté en attente de délai de connexion,/serveur.

  7. #7
    Rédacteur/Modérateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    novembre 2012
    Messages
    3 124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : novembre 2012
    Messages : 3 124
    Points : 9 130
    Points
    9 130

    Par défaut

    @MichaelREMY: deux raisons principales pour utiliser AJAX: la quantité de données et leur dynamisation.

    Si par exemple on fait une liste déroulante liée pour cette fois trouver une commune en France et non plus un département, on comprend facilement qu'il vaut mieux charger 100 départements, puis en AJAX 300 communes rattachées au département choisi, plutôt que de faire télécharger au client les 36000 communes françaises dès le début.

    De plus, vu la fréquence à laquelle les communes évoluent (des centaines de fusions/divisions/créations/renommages chaque année), ce serait très pénible de stocker cette liste dans le code client: ça impliquerait de relivrer l'application à chaque mise à jour, avec les problèmes que ça pose pour la gestion du cache. Alors que si c'est dans une base de données, on peut mettre à jour n'importe quand et très facilement.

    Donc dans les faits, on a encore souvent besoin d'AJAX dans les cas d'utilisation classiques des listes liées. Ceci dit on peut facilement adapter à AJAX la méthode d'update des select expliquée dans l'article.
    One Web to rule them all

  8. #8
    Membre confirmé
    Homme Profil pro
    nop
    Inscrit en
    mars 2015
    Messages
    436
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : nop
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : mars 2015
    Messages : 436
    Points : 620
    Points
    620

    Par défaut

    vous vous trompez et votre exemple n'est pas bien choisi.
    Les villes et communes et région n'évoluent pas tant que cela!
    Vous vous faîtes biaisés par le nombre/quantité d'éléments en liste. 300 items ou 36000 ce n'est rien du tout voyons, surtout en format text. un fichier TEXT (les rendus php ou HTM ou js par exemple) sont 1000 fois plus rapidement transmis qu'un fichier binaire et surtout que x transitions ajax avec des delay de connexion,ping,server access,firewall,antivirus...
    Avec les systèmes de docker, plugins externalisés, librairies js déportées sur des serveurs autre que le host naturel, tous les temps de chargement sont allongés maintenant donc autant limiter les nombres d'AR vers le serveur.


    De plus vous ne dites pas vrai, on ne stoque pasl la liste sur le client (ne surtout jamais écrire une liste dans un js pur), elle est toujours fournie par le serveur (le js ou la partie js) est généré par du code dynamique serverside.

  9. #9
    Rédacteur/Modérateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    novembre 2012
    Messages
    3 124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : novembre 2012
    Messages : 3 124
    Points : 9 130
    Points
    9 130

    Par défaut

    Il se trouve que je bosse précisément en ce moment avec les administrations publiques et la gestion des voiries sur des référentiels des communes, donc désolé, je ne pense pas me tromper vu que c'est moi qui gère ces mises à jour des dits référentiels.... Voilà le dernier annuel de l'INSEE. Pour mon client la mise à jour est hebdomadaire et essentielle à son activité.

    Vous vous plaignez de l'impact en performances, je vous donne un cas concret où l'on passe de 36000 items à télécharger à 400, et vous me dites que 36000 items c'est rien du tout à télécharger. Alors en récupérer par paquets de 300 ça devrait être encore moins que rien du tout, non ? Donc n'avoir aucune incidence sur la réactivité.

    Je n'ai jamais parlé de fichier binaire, en AJAX c'est 99% du temps du JSON donc du texte qui pèse à peine plus lourd que faire son propre format texte. Je ne sais pas où vous êtes allé chercher votre facteur 1000, mais peu importe que vous stockiez cette liste dans un JSON, un script inline ou un script externe, il faut bien à un moment qu'elle passe du serveur au client, avec toujours les mêmes conditions réseau. C'est vrai qu'il faut essayer de limiter le nombre de requêtes pour éviter la latence et l'overhead HTTP. Mais on parle de 100ms et 1500 bytes à tout casser pour du TCP/IPv4 en 3G, donc c'est négligeable à partir de données de plus de 10 ko.

    Enfin je trouve ça assez hautain de votre part d'affirmer que je me trompe alors que c'est quelque-chose qui est mis en pratique depuis des années. Prenez un site e-commerce au hasard et regardez s'il récupère les noms de communes sans passer par AJAX. On se tromperait donc tous d'après vous ? Un peu d'humilité svp...
    One Web to rule them all

  10. #10
    Membre confirmé
    Homme Profil pro
    nop
    Inscrit en
    mars 2015
    Messages
    436
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : nop
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : mars 2015
    Messages : 436
    Points : 620
    Points
    620

    Par défaut

    Que l'on soit bien d'accord, je n'ai pas dit de ne pas gérer/stocker dynamiquement les données, non. j'ai dit qu'il était inutile et contre-performant de "binder" ces données en ajax plutôt que de les loader (à partir de source dynamique évidemment) d'une seule traite et de faire le filtrage/triage par du javascsript 100% offline.
    Monsieur, je vous souhaite d’avoir un très bon timeout de sorti à tout endroit de la France sur tous les appareils client, d’avoir un sgbd qui soit tout le temps disponible et jamais sur-occupé par des requêtes inutiles, de ne jamais avoir des transactions hachées, de pas avoir de dockers qui ruinent vos script ajax, de ne pas avoir de firewall qui sont occupées à vérifier vos transactions inutiles, et aussi d’avoir des utilisateurs gentils qui ne saisiront jamais un code intrusif (sql injection par exemple) dans une liste ajax envoyée au serveur.

    Enfin je trouve ça assez hautain de votre part d'affirmer que je me trompe alors que c'est quelque-chose qui est mis en pratique depuis des années. Prenez un site e-commerce au hasard et regardez s'il récupère les noms de communes sans passer par AJAX. On se tromperait donc tous d'après vous ? Un peu d'humilité svp...
    Vous pensez donc avoir visité tous les sites internet e-commerce du monde entier pour dire cela. J'espère que lorsque vous serez sur un site sensible et constaterez qu'il y a une liste déroulante sans ajax, une liste avec du pur combo, vous vous questionnerez pourquoi.
    Tiens je viens de reverifier, et Amazon (c'est un site de e-commerce non?) n'utilise pas ce système pour les cp-ville. ça ne vous interroge pas ?

    Je n'ai pas dit que tout le monde se trompe, juste qu'il ne faut pas mettre du ajax là où il n'y en a pas besoin. La sélection d'une ville par filtrage de lettre se fait aussi sans ajax en javascript pur.
    En gros, je privilégie ce genre de méthode :
    https://blog.joshsoftware.com/2011/0...on-and-jquery/
    plutôt que les méthodes qui vont aller interroger le serveur (pour rien d'après mon jugement).

    Je n'ai pas répondu au sujet pour indiquer tel ou telle pratique ou conseiller, juste pour rappeler que l'ajax n'est pas une nécessite absolue, et qu'avant l'ajax il y a le dhtml offline...

  11. #11
    Rédacteur/Modérateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    novembre 2012
    Messages
    3 124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : novembre 2012
    Messages : 3 124
    Points : 9 130
    Points
    9 130

    Par défaut

    Si le serveur a une latence de plus de 100ms pour pondre une requête JSON aussi simple, ce n'est pas AJAX le problème, c'est le serveur. Mais lui faire cracher les 36000 communes pour chaque utilisateur quand la majorité ne sont intéressés que par celles de leur département, je doute que ce soit l'idéal question perfs.

    Amazon n'a pas du tout besoin de la liste des villes, juste d'une adresse postale, donc ça va être difficile de démontrer quoi que ce soit avec ça... Prenons plutôt les sites immobiliers, où récupérer la ville est utile. Je n'ai regardé que seloger.com, logic-immo et Paru-Vendu: tous utilisent AJAX... De même, leboncoin utilise AJAX pour trouver les communes par filtrage de lettre.

    Mais au fond, on est d'accord: AJAX n'est pas une nécessité absolue. Pour des données de moins de 5-10ko, qui ne changent pas trop souvent, on peut envisager de les précharger en totalité. Pour tout les autres cas, paginer ou filtrer les données est essentiel, et AJAX est le mécanisme le moins disruptif à cet effet.
    One Web to rule them all

  12. #12
    Membre confirmé
    Homme Profil pro
    nop
    Inscrit en
    mars 2015
    Messages
    436
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : nop
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : mars 2015
    Messages : 436
    Points : 620
    Points
    620

    Par défaut

    Citation Envoyé par SylvainPV Voir le message
    Mais au fond, on est d'accord: AJAX n'est pas une nécessité absolue. Pour des données de moins de 5-10ko, qui ne changent pas trop souvent, on peut envisager de les précharger en totalité. Pour tout les autres cas, paginer ou filtrer les données est essentiel, et AJAX est le mécanisme le moins disruptif à cet effet.
    mais votre script ajax, sa librairie, sa requête, ses composantes de sécurité, son accès réseau (ses multiples mêmes), ses passages en log, ...etc nécessitent plus de 10ko en ressources, en bande passante en charge...etc c'est là que vous ne me comprenez pas. Des données transmises en fichiers linéaires ne consomment pas tant que ça (vous êtes biaisais pas ces chiffres quantitatifs). n'avez-vous jamais remarquez que la vitesse de téléchargement d'un fichier 100% textuel (un dump sql non compressé par exemple, ou un export .csv ou txt) de plusieurs 100 de Mo va extrement plus vite qu'un même fichier en binaire. Une page HTM de 10Ko ira plus vite qu'une page de 1Ko + 5 requetes ajax et ça consommera moins !!

    Ainsi si je suis votre raisonnement et le démontre (avec humour) :
    vous préférez construire une ligne de chemin de fer avec 10 gares d'arrêts entre monaco et paris pour transporter 5 containers en 5 fois plutôt qu'une seule ligne directe d'un train express à 5 wagons d'une ligne point à point (sans arrêt)! vous croyez que minimiser la quantité transportée par wagon coutera moins cher à la société.... cher monsieur vous oubliez le coût et les temps aux gares, les vérifications des billets à chaque point....,etc.

    Comme je le dis plus haut, le coût de traitement de votre méthode ajax coutent plus cher en charge et en octets au serveur et au client et en bande passante que la quantité totale de données à transporter.

    Personnellement un script ajax est utile quand :
    - il nécessite de brasser de multiples données croisés (un process métier) et non pas juste un filtrage/pagination.
    - nécessite de garder une confidentialité (ne pas fournir tout au client)
    - quand le client (l’utilisateur) peut avoir à effectuer plusieurs choix successifs des données dans la même session)
    - nécessite absolue d’apporter une UX avantageuse et ergonomique (donc pas juste pour être à la mode et faire comme tout le monde).

  13. #13
    Rédacteur/Modérateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    novembre 2012
    Messages
    3 124
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : novembre 2012
    Messages : 3 124
    Points : 9 130
    Points
    9 130

    Par défaut

    Récupérer un JSON en AJAX, c'est une broutille... ça se fait en une ligne de code en ES6:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    fetch("/api/listeVilles/Nord").then(res => res.json()).then(function(villes){ ... })
    Et pour les plus vieux navigateurs, ça peut se faire avec une petite fonction de dix lignes. Il faut m'expliquer d'où est-ce que vous sortez vos 10ko en bande passante suplémentaire.

    Ensuite vous me refaites le coup du binaire, mais d'où est-ce que ça sort cette histoire de binaire ? L'AJAX c'est historiquement du XML et en pratique c'est 99% du temps du JSON, qui sont des formats textuels. Je ne sais pas non plus ce que vient faire Docker dans cette histoire.

    Enfin, ce n'est pas une histoire de petits trains qui va occulter le fait que je vous ai trouvé 4 sites grands publics utilisant AJAX pour récupérer les noms des villes. Si vous continuez à prétendre que vous connaissez mieux votre sujet que toutes les équipes techniques réunies de ces sites, je pense qu'il vaut mieux arrêter cette discussion ici.
    One Web to rule them all

  14. #14
    Membre confirmé
    Homme Profil pro
    nop
    Inscrit en
    mars 2015
    Messages
    436
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Somme (Picardie)

    Informations professionnelles :
    Activité : nop
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : mars 2015
    Messages : 436
    Points : 620
    Points
    620

    Par défaut

    je vous parlais de binaire car vous pensez que cette masse d'informations est longue à charger côté client (et donc qu'il font utiliser de l'ajax pour éviter ce loading au client) , et donc je vous parler du binaire car un fichier texte de 1Go va plus vite à télécharger qu'un fichier binaire de 1Go.

    sujet clos pour moi.

  15. #15
    Rédacteur/Modérateur
    Avatar de jreaux62
    Homme Profil pro
    Webdesigner
    Inscrit en
    août 2008
    Messages
    9 631
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 50
    Localisation : France, Pas de Calais (Nord Pas de Calais)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Arts - Culture

    Informations forums :
    Inscription : août 2008
    Messages : 9 631
    Points : 19 290
    Points
    19 290

    Par défaut

    D'autant que vous êtes hors-sujet tous les deux !

    Je rappelle le titre : "Créer des listes déroulantes liées entre elles sans utiliser Ajax"



    N.B. Si vous pouviez arrêter de vous maintenant...
    "Si tu suis le chemin qui s'appelle « plus tard », tu arriveras à la place qui s'appelle « jamais »."
    François Camille Prévot (1910-1996), instituteur puis Directeur d'école et... mon grand-père.
    "Ce qui se conçoit bien s'énonce clairement. Et les mots pour le dire arrivent aisément."
    Nicolas Boileau-Despréaux (1636-1711).
    Mes tutos DVP
    Gestion-Affichage de Nouvelles
    Affichage en tableau HTML
    Fonctions de redimensionnement d'images

Discussions similaires

  1. Réponses: 0
    Dernier message: 09/03/2009, 19h01
  2. Listes déroulantes liées entre elles (autre lien)
    Par senacle dans le forum JavaScript
    Réponses: 2
    Dernier message: 29/09/2005, 21h22
  3. Listes déroulantes liées entre elles
    Par denisC dans le forum JavaScript
    Réponses: 0
    Dernier message: 27/07/2002, 15h53

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo