11521 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Cocher un radio bouton a l'aide d'une fonction Js

Bonjour, je sais que ce sujet a déjà été mis plusieurs fois, cependant même en lisant les réponses et en les essayant je n'ai pas réussi à faire marcher ce que je voulais....

Alors voila, j'ai 3 radios boutons, l'un d'eux est déjà coché. Ce que je voudrai faire c'est: lorsque l'utilisateur coche un autre bouton que celui déjà coché, cela affiche une pop up (ça c'est bon) qui lui demande s'il veut vraiment changer. S'il clique sur oui cela change bien le radio bouton qui est coché (c'est bon aussi) mais s'il clique sur non, cocher le radio bouton qui était déjà coché (c'est ce que je n'arrive pas).

Voici mes radio bouton:

<input type="radio" name="categorie" value="PourInfo" id="PourInfo" class="pourInfo" onclick="pourInfo()" /> <label for="PourInfo">Pour information</label>
 
 
<input type="radio" name="categorie" value="Mineure" id="Mineure" class="mineure" onclick="mineure()" /> <label for="Mineure">Mineure</label>
 
 
<input type="radio" name="categorie" value="Majeure" id="Majeure" class="majeure" checked/> <label for="Majeure">Majeure</label><br /> <br/>


Voici les fonction pourInfo() et mineure() qui ouvre les pop up

const popUpMineure=document.getElementById('boxMineure');
const popUpPourInfo=document.getElementById('boxPourInfo');
  
 popUpMineure.style.display='none';
 popUpPourInfo.style.display='none';
  
  function pourInfo(){
        popUpPourInfo.style.display='block';
    }
  
    function mineure(){
        popUpMineure.style.display='block';
    }


Voici le HTML des div pou les pop up:

<div id="boxPourInfo">
    <div id="textPopUp">
        Voulez-vous vraiment change le type de non conformité de la fiche ?<br/>
    </div>
    <div id="boutonsPopUp">
        <button id="PopUpNon" type="button" onclick="laisserMajeure()" class="nePasChanger">Non</button>
        <button id="PopUpOui" type="button" onclick="fermerPopUp()" >Oui</button>
    </div>
</div>
 
<div id="boxMineure">
    <div id="textPopUp">
        Voulez-vous vraiment change le type de non conformité de la fiche ?<br/>
    </div>
    <div id="boutonsPopUp">
        <button id="PopUpNon" type="button" onclick="laisserMajeure();" class="nePasChanger">Non</button>
        <button id="PopUpOui" type="button" onclick="fermerPopUp()" >Oui</button>
    </div>
</div>


J'ai testé plusieurs choses pour le bouton non mais rien ne marche.... voici ce que j'ai testé:

$(document).ready(function(){
        $(".nePasChanger").click(function(){
            $("#Majeure").prop("checked", true);
        });
        popUpPourInfo.style.display='none';
        popUpMineure.style.display='none';
    });


ou encore 

function laisserMajeure(){
 
     document.form['categorie'][3].checked=true;
 
       popUpPourInfo.style.display='none';
       popUpMineure.style.display='none';
 
   }


Mais aucun ne marche... Pouvez-vous m'aider ? Merci !
Salut,

Deja le code de tes popup sont des copiés collés, du coup tu as plein d'id en doublon, ça ne m'a pas l'air terrible, tu devrait pouvoir avoir un seul code de popup.

Et ensuite avant de trop réfléchir à un truc potentiellement compliqué, ça ne pourrait pas être l'inverse ? D'abord demandé si elle veut changer de valeur et si c'est oui tu autorises les modifications ?
Bonjour,

C'est vrai pour les id des pop up, mais c'est pour le CSS pour avoir les même mises en page, mais je vais les changer.

Vous voulez dire, l'utilisateur clique sur un bouton, ça ne selectionne pas le radio boutton, si il met oui ça le selection, si il met non ça le sélectionne pas ? Je ne vois pas trop comment faire cela....

Merci!
Bonjour,

C'est vrai pour les id des pop up, mais c'est pour le CSS pour avoir les même mises en page, mais je vais les changer.

Vous voulez dire, l'utilisateur clique sur un bouton, ça ne selectionne pas le radio boutton, si il met oui ça le selection, si il met non ça le sélectionne pas ? Je ne vois pas trop comment faire cela....

Merci!
Si c'est utilisé plusieurs fois, c'est pas un id c'est une classe qu'il faut mettre.
Mais la j'ai l'impression que c'est exactement le même bout de code, donc on factorise tout ça en le mettant seulement une fois ça permet d’alléger et de ne modifier qu'un seul bout de code le jour où l'on veut faire une modification

L'idée inverse que je propose ça serait de grisé les options (via disable) puis de poser la question : voulez vous modifiez la valeur ? Si oui, hop ça enlève le disable et le gars coche ce qu'il veut, si non il ne peut rien cocher.
Cela me semblerait plus simple, mais après je ne connais pas le contexte ni ce que tu veux faire, donc ce ne peut être pas possible dans ton cas ou pas adapté à ce que tu veux faire.
J'allais dire qu'on doit pouvoir simplifier en faisant juste une vérification sur un changement et hop une belle solution qui apparaît. Smiley clapclap kustolovic, très propre.
Sujet clos
Aller à