Bonjour à toutes et à tous,

Je viens solliciter votre aide afin de me débloquer un peu car je suis coincé depuis quelques jours pour faire mon site web.

En effet, l'objectif de ce dernier et de rediriger un utilisateur vers une page web ou une autre (en réalité le programme en comporte une centaine) en fonction de ces réponses.

Le formulaire est constitué de 3 listes déroulantes (nom d'une étape, acteur de l'étape, hiérarchie de l'étape) contenant des données issues d'un fichier CSV qui est comme la "base de donnée" de mon programme. A ce jour, j'ai donc crée ces listes déroulantes et cela fonctionne bien.

Dans le fichier CSV est stocké entre autre :

-le nom de l'étape en toutes lettres (qui est donc affiché dans une liste déroulante)

-l'abréviation de chaque page HTML que j'ai crée. Par exemple, la page HTML nommée ARRET_MODIF.html aura comme abréviation ARRET_MODIF dans le fichier CSV. 

Toutes les informations pour une étapes sont stockées sur une seule ligne dans le fichier CSV, ce qui permet d'avoir accès au reste des infos quand on n'en possède qu'une.

L'objectif serait donc lire le nom de l'étape qui a été sélectionné dans la liste déroulante, de le relié à l'abréviation correspondante et de relié l'abréviation à la page HTML associée. 

Je sais pas si j'ai été très clair, je vous mets une partie du code en dessous. 

Merci pour votre aide

une partie du formulaire :

            <fieldset>
                <legend>Rechercher un ensemble d'étapes</legend>
                
                <label for="acteur">Acteur </label>
                <select name="stakeholder" id="stakeholderid">
                    <option id="optionacteur" value=""></option>
                </select>

                <br> 
                <p><b>et / ou</b></p>
                
                <label for="hierarchie"> Hiérarchie </label>
                <select name="hierarchy" id="hierarchyid">
                    <option id="optionhierarchie" value=""></option>
                </select>
            </fieldset>

Les fonctions qui complètent les listes déroulantes :

            d3.csv("prereq.csv",
                function(d) {
                    return {  
                        Acteur: d.Acteur 
                    };  
                },
                function(data2) {
                    csvtoarrays2(data2)
                }
            );
            function csvtoarrays2(data2) {
                var listeActeurall= [];               
                for (i=0;i<data2.length; i++ ) { 
                    listeActeurall[i]=data2[i].Acteur;
                }
                const listeActeurtemp = [...new Set(listeActeurall.map(a => JSON.stringify(a)))].map(a => JSON.parse(a))
                var listeActeur = listeActeurtemp.sort()
                console.log(listeActeur)             
                var select2  = document.getElementById("stakeholderid");
                for (i=0; i < 13; i++ ) {
                    var el2 = document.createElement("option");
                    var temp2=listeActeur[i]
                    el2.textContent = temp2;
                    select2.appendChild(el2);
                }
            }

Ma fonction manquante : 

function rechercheCSV() { 
                
                var Debutselectionnee = document.getElementById("start").checked;
                var selectstepName = document.getElementById("stepNameid");
                var selectactor = document.getElementById("stakeholderid");
                var selecthierarchy = document.getElementById("hierarchyid");

                var Nomselectionnee = selectstepName.options[selectstepName.selectedIndex].value;
                var Acteurselectionnee = selectactor.options[selectactor.selectedIndex].value;
                var Hierarchieselectionnee = selecthierarchy.options[selecthierarchy.selectedIndex].value;


                d3.csv("prereq.csv",
                    function(d) {
                        return {  
                            Nom: d.Nom ,
                            Acteur: d.Acteur ,
                            Abreviation: d.Abréviation ,
                            Niveau1: d.Niveau_1 ,
                            Niveau2: d.Niveau_2 ,
                            Niveau3: d.Niveau_3 ,
                            Niveau4: d.Niveau_4 ,
                        };  
                    },
                    function(data3) {
                        console.log(data3)
                        lectureCSV(data3)
                    }
                );

                function lectureCSV(data3){
                    //Case "depuis le début" cochée
                    if (document.getElementById("start").checked === true) {
                        //lire la première ligne du CSV, récuperer l'abréviation => faire le lien vers la page html
                        var abreviationPage1 = data3[0].Abreviation;
                        // lire abreviationPage1 et rechercher la page html qui a le même nom
                        
                        // Afficher le lien de la page html avec le nom de l'étape 

                    }

-
Edité par Thomas Lgrge 18 mai 2022 à 17:56:12

Bonjour, Pas d'image de code totalement inutilisable par copier/coller pour tests éventuels.

Le message qui suit est une réponse automatique activée par un membre de l'équipe. Les réponses automatiques leur permettent d'éviter d'avoir à répéter de nombreuses fois la même chose, ce qui leur fait gagner du temps et leur permet de s'occuper des sujets qui méritent plus d'attention.
Nous sommes néanmoins ouverts et si vous avez une question ou une remarque, n'hésitez pas à contacter la personne en question par Message Privé.
Pour plus d'informations, nous vous invitons à lire les règles générales du forum

Merci de colorer votre code à l'aide du bouton Code

Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue. Si vous utilisez l'éditeur de messages en mode Markdown, il faut utiliser les balises <pre class="brush: jscript;">Votre code ici</pre>.

Merci de modifier votre message d'origine en fonction.

Liens conseillés

• Charte de bonne conduite
• Règles générales du forum