Discussion :

[mormic]

Bonjour à tous.
J'ai un formulaire de saisie vierge que je peux remplir manuellement ou automatiquement pour modification.
Dans ce formulaire il y a des 'radio button':

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
                <input type="radio" id="tempe" name="capt" value="0"/>
                <label for="tempe">Température</label>
                <input type="radio" id="humide" name="capt" value="1"/>
                <label for="humide">Humidité</label>
                <input type="radio" id="presse" name="capt" value="2"/>
                <label for="presse">Pression</label>
                <input type="radio" id="lume" name="capt" value="3"/>
                <label for="lume">Luminosité</label>

Lorsque une saisie doit être modifiée, le serveur envoit les données et pour les boutons radio, il envoit '2' par exemple. Il faudrait que le bouton qui a la value 2 soit 'checked'
Y a-t'il une commande simple avec querySelector pour faire cela?

[gabi7756]

Bonjour,

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
var number = 2
document.querySelector('#NUMBLC input[value="'+number+'"]').checked

Un truc du genre ?
Cdt

[Toufik83]

Bonjour,

Lorsque une saisie doit être modifiée, le serveur envoit les données et pour les boutons radio

Du côté serveur, vous pouvez utiliser l'attribut checked lors de la soumission de formulaire comme suite

<input type="radio" id="presse" name="capt" value="2" <?=isset($_POST["capt"])&&(int)$_POST["capt"]==2?' checked="checked"':'';?> />.

La même chose pour les autres boutons radio, et si vous utilisez la méthode $_GET remplacez $_POST par $_GET

[NoSmoking]

Bonjour,
c'est effectivement pas très clair, côté client (navigateur) ou serveur ?

Sinon effectivement côté client :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
const radioBtn = document.querySelector("[name='capt'][value='2']");
radioBtn.checked = true;

[mormic]

merci pour toutes ces réponses.

c'est effectivement pas très clair, côté client (navigateur) ou serveur ?

Dans mon énocé, j'avais écrit:

le serveur envoie les données et pour les boutons radio, il envoit '2' par exemple

J'en convient que je n'ai pas tout précisé:
1 le client demande l'envoi d'un formulaire.
2 le serveur envoie un formulaire
3 le client demande à modifier un enregistrement éxistant
4 le serveur envoie les données demandées: par exemple "520B1O00521B1F00" où le 2 représente le radio button à checked.
5 le client accuse réception.

La solution de NoSmoking me convient. Merci

[mormic]

Re bonjour à tous.
Je reprends cette discussion car je viens de détecter un truc bizarre:
Toujours avec mon formulaire

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<input type="radio" id="tempe" name="capt" value="0"/>
                <label for="tempe">Température</label>
                <input type="radio" id="humide" name="capt" value="1"/>
                <label for="humide">Humidité</label>
                <input type="radio" id="presse" name="capt" value="2"/>
                <label for="presse">Pression</label>
                <input type="radio" id="lume" name="capt" value="3"/>
                <label for="lume">Luminosité</label>

Dans mon Javascript je reçois le message msg du serveur: "530B1O00531B1F00M49P86"
et j'écris ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
let capteur = msg.charAt(1);
    document.querySelector("[name='capt'][value=" + capteur + "]").checked=true;

Cela ne fonctionne pas. Pour le faire fonctionner je dois entourer la variable capteur par des simples quotes! comme ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
let capteur = msg.charAt(1);
    document.querySelector("[name='capt'][value='" + capteur + "']").checked=true;

Pourquoi alors que pour d'autres cas similaires, ce n'est pas nécessaire?
Par exemple si j'écris:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
let rCommandeM=msg.charAt(5);
        document.querySelector("[name='RcommandeM'][value=" + rCommandeM + "]").checked=true;

Cela fonctionne normalement, sans mettre RcommandeM entre quotes.
Bizarre non?

[Toufik83]

Bonjour,

Pourquoi alors que pour d'autres cas similaires, ce n'est pas nécessaire?

Lorsque la valeur commence par une lettre et ne contient aucun espace, ceci pourrait fonctionner sans avoir a utiliser les guillemets/apostrophes, mais le cas contraire non.

Par exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
let v="2abc";
 
document.querySelector("[name='capt'][value="+v+"]"); //sélecteur invalide, ne fonctionne pas.
 
v="abc 2";
document.querySelector("[name='capt'][value="+v+"]"); //sélecteur invalide (présence d'un espace), ne fonctionne pas.
 
v="abc2";
document.querySelector("[name='capt'][value="+v+"]"); //Fonctionne.

Dans votre exemple de la valeur de rCommandeM, la sélection fonctionne parce que c'est sûr que la valeur commence par une lettre et ne contient aucun espace.

Ceci dit que vous devriez toujours utiliser les guilleumets/apostrophes pour éviter les mauvaises surprises.

[mormic]

Ah oui!...Il fallait le savoir. Ou alors, j'ai encore omis de lire quelque part.
Merci Toufik83, je comprends que vous êtes un "expert confirmé".
Cordialement