5
Indiquez l’intérêt que vous portez à cette question
1

Bouton submit qui ne marche pas

Bonjour,
Je suis un "développeur web" débutant. Dans le cadre de mon stage, pour validé la formation que je suis, je bosse sur une site qui est en SPIP et cela fait un bon bout de temps que je suis bloqué sur un problème qui parait simple au départ mais une fois qu’on a bien creuser ce n’est pas si "facile" qu’on le pensait.
Je vais faire simple. J’ai un formulaire à liste déroulante a choix multiple. Ce formulaire génère des mots-clés, que les utilisateurs pourront coché pour aller sur une page. Grâce aux code de SPIP (une Boucle et l’URL d’une page qui regroupe déjà les mots-clés), j’arrive récupérer les mots-clés et leurs URL (car ces mots-clés là sont des pages contenant des articles).
Mais mon problème c’est qu’une fois qu’on a coché le ou les mots-clé, j’ai un bouton qui permet de valider ce qu’on a coché. Mais ce bouton la, quand on valide, elle recharge juste la page et nous renvoie pas sur la page des mots-clés qu’on a coché.
En gros, j’aimerais pouvoir lié mon bouton () à mon checkbox () pour qu’il puisse les lien et m’envoyé sur la page du mot-clé coché.

Je vous met le code. Je précise que ce code est dans mon sommaire (qui est la page d’accueille du site que je travail) et qu’il n’y a pas d’autre code externe.

<form method="post">
       <div  class="multiselect" onChange="location.href=''+this.options[this.selectedIndex].value">
           <div class="selectBox" onclick="showCheckboxes()">
               <select>
                  <option selected>Tags</option>
               </select>
              <div class="overSelect"></div>
           </div>
     
                   
           <div id="checkboxes">
              <!-- La boucle ici est le code SPIP qui appelle mes mots dans la
                     base depuis la table (MOTS), son id (id_groupe=1)
                     et par leurs titre -->
              <BOUCLE_Tags(MOTS) {id_groupe=1} {par titre}>
                 <label >
                    <input type="checkbox" value="#URL_MOT" />#TITRE
                 </label>
              </BOUCLE_Tags>
           </div>  
       </div>
     <input type="submit" class="submit" value="Recherche">
     </form>

<style>
   .multiselect {
       width: 200px;
   }

   .selectBox {
       position: relative;
   }

   .selectBox select {
       width: 100%;
       font-weight: bold;
   }

   .overSelect {
       position: absolute;
       left: 0;
       right: 0;
       top: 0;
       bottom: 0;
   }

   #checkboxes {
       display: none;
       border: 1px #dadada solid;
       background-color: gray;
   }

   #checkboxes label {
       display: block;
   }

   #checkboxes label:hover {
       background-color: yellow;
   }
</style>
<script>
   var expanded = false;

   function showCheckboxes() {
       var checkboxes = document.getElementById("checkboxes");
       if (!expanded) {
           checkboxes.style.display = "block";
           expanded = true;
       } else {
           checkboxes.style.display = "none";
           expanded = false;
       }
   }
</script>

Je suis ouvert aux discutions pour bien comprendre, si vous n’avez pas bien compris mon explication ; et pour, bien-entendu, trouver une solution.

Merci d’avance ! :)