Liste de choix et chargement script JS

**draidius** · 07/02/2024, 07h59

Bonjour

J'ai fait un petit code avec une liste d'options qui forme un menu d�roulant appelant des fichiers *.JS
les fichiers *JS sont bien dans le m�me r�pertorie que la feuille htlm

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
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html lang="FR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Site de distribution</title>
    <style>
        /* Style pour les menus et le bouton de téléchargement */
        .menu-container {
            display: inline-block;
            margin-right: 10px; /* Ajoutez de l'espace entre les menus */
        }
        #zoneTelechargement {
            display: inline-block;
            margin-left: 10px; /* Décale le bouton vers la droite */
            margin-top: 10px; /* Ajoutez de l'espace en haut */
        }
    </style>
</head>
<body>
 
<form method="POST" action="--WEBBOT-SELF--">
	<!--webbot bot="SaveResults" U-File="D:\pages_tests\_private\form_results.csv" S-Format="TEXT/CSV" S-Label-Fields="TRUE" -->
	<p align="center"><input border="0" src="../Sites_web/Images/Inserm.jpg" name="I1" width="870" height="258" type="image"></p>
</form>
<p align="center">Merci de remplir le fichier de licence pour les logiciels 
payants:<!-- Liste déroulante pour le premier menu -->
<a href="../Licences_Logiciels/Liste_Licences_par_service.xlsm">Fichier de 
licence</a>, A l'ouverture du lien, faire &quot;Ouvrir avec&quot; et ne pas choisir &quot; 
Enregistrer sous&quot;</p>
 
<!-- Premier menu "Choisissez un site" -->
<div class="menu-container">
    <label for="siteMenu">Choisissez un site :</label>
    <select id="siteMenu" onchange="choisirScript()">
        <option value="ScriptCommun">Logiciels communs</option>
        <option value="scriptSite1">Site1</option>
        <option value="scriptSite2">Site2</option>
    </select>
</div>
 
<!-- Deuxième menu "Choisissez le système d'exploitation" -->
<div class="menu-container">
    <label for="deuxiemeMenu">Choisissez le système d'exploitation :</label>
    <select id="deuxiemeMenu" onchange="afficherTroisiemeMenu()"></select>
</div>
 
<!-- Troisième menu "Choisissez une catégorie" -->
<div class="menu-container">
    <label for="troisiemeMenu">Choisissez une catégorie :</label>
    <select id="troisiemeMenu" onchange="afficherQuatriemeMenu()"></select>
</div>
 
<!-- Quatrième menu "Choisissez un environnement" -->
<div class="menu-container">
    <label for="quatriemeMenu">Choisissez un environnement :</label>
    <select id="quatriemeMenu" onchange="afficherCinquiemeMenu()"></select>
</div>
 
<!-- Cinquième menu "Choisissez un logiciel" -->
<div class="menu-container">
    <label for="cinquiemeMenu">Choisissez un logiciel :</label>
    <select id="cinquiemeMenu" onchange="telechargerLogiciel()"></select>
</div>
 
<!-- Zone de téléchargement -->
<div id="zoneTelechargement"></div>
 
<!-- Script pour charger les scripts en fonction de l'option sélectionnée -->
<script>
    function choisirScript() {
        var siteMenu = document.getElementById("siteMenu");
        var selectedValue = siteMenu.value;
 
        var scriptSrc = "";
 
        switch (selectedValue) {
            case "ScriptCommun":
                scriptSrc = "ScriptCommun.js";
                break;
            case "scriptSite1":
                scriptSrc = "scriptSite1.js";
                break;
            case "scriptSite2":
                scriptSrc = "scriptSite2.js";
                break;
            // Ajoutez d'autres cas pour d'autres options si nécessaire
        }
 
        if (scriptSrc !== "") {
            var scriptElement = document.createElement("script");
            scriptElement.src = scriptSrc;
            document.body.appendChild(scriptElement);
        }
    }
</script>
</body>
</html>

Et dans le d"bugger de FF il me met: " Uncaught SyntaxError: expected expression, got '<'"
pourtant les noms des JS sont bons, je n'ai ps de balise "<scritp> dans les js....

Si quelqu�un � une id�e

Merci

**ProgElecT** · 07/02/2024, 09h17

Salut

Rien � voir, mais dans le switch (selectedValue) { tu as deux fois le m�me case "scriptSite1": menant � deux script javascript diff�rents.

Si je comprend bien c'est au moment du choix que l'erreur apparait, non pas au lancement du programme car chez moi le code que tu nous as mis ne provoque pas d'erreur chez moi.
Personnellement je passerai au validateur les trois scripts selectionnable par le switch

**draidius** · 07/02/2024, 11h41

Bonjour ProgElecT

Oui j'ai vue apr�s avoir post� mais m�me en corrigeant �a ne change rien, les JS ne se d�clenchent pas :/

mais en fait dans les JC? c'est un code assez compliqu� ( pour moi ) et peut �tre que j'ai des probl�mes avec les fonctions par site, car quand je mets le code directement dans le html �a fonctionne, mais je voulais le rendre modulable car chaque site n'a pas besoin d le m�me chose...

:/

Le valideur n'a rien trouv� de bloquant, mais en tout cas merci pour le lien car je ne connaissais pas

**unanonyme** · 07/02/2024, 13h41

probl�me d'url ? scriptSrc = "ScriptCommun.js"; r�sout une url qui affiche une 404 cod�e en HTML, d'o� le message d'erreur autour du signe <

**draidius** · 07/02/2024, 13h43

non il ne se passe simplement rien..

**unanonyme** · 07/02/2024, 13h52

c'est trop laconique.

�a charge le script, mais le script n�ex�cute rien ? Il n'y a plus d'erreurs ?

Sinon, on peut d�j� simplifier un peu, m�me si �a ne changera rien.

Code js :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
function choisirScript() {
  var siteMenu = document.getElementById("siteMenu");
  var selectedValue = siteMenu.value;
  if (!selectedValue) {
    return;
  }
 
  var scriptSrc = selectedValue + ".js";
 
  var scriptElement = document.createElement("script");
  scriptElement.src = scriptSrc;
  document.body.appendChild(scriptElement);
}

Liste de choix et chargement script JS

JavaScript

Vue hybride

Discussions similaires

Partager

Partager