Logo GNT
Actualités Tests & Guides Bons Plans
GTA 6 iPhone 17 Copilot Switch 2 Temu ChatGPT Tesla
OVH Cloud OVH Cloud
Entraide Développement Développement Langage JavaScript Java Script pour inclure du HTML dans une page

Java Script pour inclure du HTML dans une page

7 réponses
Avatar
Serge Nazarian
Bonjour,

Est-il possible de faire une fonction foo() en JavaScript qui insère
du code HTML là où elle est appelée. Je m'explique :

Je souhaite insérer un input caché <input type="hidden"
value="ma_valeur"> si on clique sur un bouton.

Le code HTML suivant

<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="radio" name="bouton1" value="Non"> Non

donnerait si le bouton Oui est coché,

<form action="envoi.php" method="post" name="inscription"<br>
...

<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="hidden" value="ma_valeur">
<input type="radio" name="bouton1" value="Non"> Non

...
</form>

Mais il faudrait aussi que si, après avoir coché Oui, on coche Non, le
code HTML redevienne (Je souhaite une bascule suivant que Oui ou Non
est coché)

<form action="envoi.php" method="post" name="inscription"
...

<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="radio" name="bouton1" value="Non"> Non

...
</form>

En fait, je souhaite pouvoir envoyer DEUX valeurs (par POST à la
validation du formulaire) si le bouton est coché, mais je ne peux pas
utiliser du PHP car tout ceci doit être fait avant la validation du
formulaire par POST.
J'espère être clair, sans en être vraiment sûr !
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.

Merci pour toute aide.

Cordialement.

--
Serge Nazarian
Pour m'écrire directement : http://cerbermail.com/?ZDkROVSJlu
Signaler un problème avec ce contenu

7 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
Otomatic
Serge Nazarian écrivait :
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.

Deux formulaires et pas besoin de javascript.
Avatar
Serge Nazarian
Otomatic a écrit le 27/09/2016 :
Serge Nazarian écrivait :
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.

Deux formulaires et pas besoin de javascript.

avec le même bouton ?
--
Serge Nazarian
Pour m'écrire directement : http://cerbermail.com/?ZDkROVSJlu
Avatar
Otomatic
Serge Nazarian écrivait :
Otomatic a écrit le 27/09/2016 :
Serge Nazarian écrivait :
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.
Deux formulaires et pas besoin de javascript.

avec le même bouton ?

J'ai relu la question initiale et j'avoue qu'elle est quelque peu
nébuleuse quant au résultat à obtenir.
De plus :
mais je ne peux pas utiliser du PHP car tout ceci doit être
fait avant la validation du formulaire par POST

Si ce n'est pas en PHP, comment les données envoyées par le formulaire
sont-elles vérifiées ?
Des boutons qui envoient plusieurs valeurs et qui changent d'état ou de
libellé après validation, c'est (relativement) simple à faire en PHP.
--
Ce n'est pas parce qu'ils sont nombreux à avoir tort
qu'ils ont forcément raison. Coluche
Avatar
Yliur
Le Tue, 27 Sep 2016 12:18:29 +0200
Serge Nazarian a écrit :
Bonjour,
Est-il possible de faire une fonction foo() en JavaScript qui insère
du code HTML là où elle est appelée. Je m'explique :
Je souhaite insérer un input caché <input type="hidden"
value="ma_valeur"> si on clique sur un bouton.
Le code HTML suivant
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="radio" name="bouton1" value="Non"> Non
donnerait si le bouton Oui est coché,
<form action="envoi.php" method="post" name="inscription"<br>
...
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="hidden" value="ma_valeur">
<input type="radio" name="bouton1" value="Non"> Non
...
</form>
Mais il faudrait aussi que si, après avoir coché Oui, on coche Non,
le code HTML redevienne (Je souhaite une bascule suivant que Oui ou
Non est coché)
<form action="envoi.php" method="post" name="inscription"
...
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="radio" name="bouton1" value="Non"> Non
...
</form>
En fait, je souhaite pouvoir envoyer DEUX valeurs (par POST à la
validation du formulaire) si le bouton est coché, mais je ne peux pas
utiliser du PHP car tout ceci doit être fait avant la validation du
formulaire par POST.
J'espère être clair, sans en être vraiment sûr !
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.
Merci pour toute aide.

Si je comprends bien, tu veux envoyer une valeur selon l'option
sélectionnée parmi plusieurs ?
Je pense que ce serait plus simple d'avoir toujours le champ (qui n'a
pas de nom ici, il faudrait lui en donner un) destiné à contenir
"ma_valeur".
Une solution est de capturer l'événement "modification de l'état" et de
remplir ou vider ce champ (pas la peine de générer/supprimer tout le
code html).
Ou bien un événement sur le bouton de validation du formulaire, qui
inscrit ou non la valeur dans le champ en fonction de ce qui est coché
puis qui envoie le formulaire.
Ou encore simplement d'envoyer systématiquement cette valeur et d'en
tenir compte ou non côté serveur (où tu sauras si c'est Oui ou Non qui
a été coché).
Avatar
SAM
Le 27/09/16 à 12:18, Serge Nazarian a écrit :
Bonjour,
Est-il possible de faire une fonction foo() en JavaScript qui insère du
code HTML là où elle est appelée. Je m'explique :

oui, bien sûr.
Mais ... est-ce une bonne idée ?
Qui va s'assurer que le visiteur a activé son JS et que le hidden a bien
été créé/effacé ?
Je souhaite insérer un input caché <input type="hidden"
value="ma_valeur"> si on clique sur un bouton.

ce serait mieux si le hidden avait un name, non ?
Le code HTML suivant
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="radio" name="bouton1" value="Non"> Non

Il me semble, mais c'est à vérifier, qu'il n'y a pas besoin de
JavaScript, yaka mettre "ma_valeur" comme valeur du bouton-radio [oui]
et laisser vide celle du bouton [non]
et de se passer de ce hidden !
Normalement le post ne va envoyer que la valeur du bouton coché.
<input type="radio" name="bascule" value="ma_valeur">Oui
<input type="radio" name="bascule" value="" checked> Non
donnerait si le bouton Oui est coché,
<form action="envoi.php" method="post" name="inscription"<br>
...
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="hidden" value="ma_valeur">
<input type="radio" name="bouton1" value="Non"> Non
...
</form>
Mais il faudrait aussi que si, après avoir coché Oui, on coche Non, le
code HTML redevienne (Je souhaite une bascule suivant que Oui ou Non est
coché)

Ne serait-ce pas plus simple d'avoir le hidden toujours là et qu'on se
contente de lui en changer la valeur ?
function bascule() {
var h = document.getElementById('trucmuche'),
v = h.value;
h.value = v=='ma_valeur'? '' : 'ma_valeur';
}
<form>
<input type="radio" name=bouton1" onclick="bascule()">oui
<input type="radio" name=bouton2">non
<input type="hidden" name="trucmuche" id="trucmuche">
</form>
(snip)
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.

<input type="checkbox" onclick="bascule"> d'accord ?
<input type="hidden" name="trucmuche" id="trucmuche">
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Avatar
SAM
Le 27/09/16 à 12:18, Serge Nazarian a écrit :
Bonjour,
Est-il possible de faire une fonction foo() en JavaScript qui insère du
code HTML là où elle est appelée.

Oui, bien sûr !
Mais, à mon idée que j'ai vue partagée par ailleurs, tu n'en a pas besoin.
voir ma réponse sur l'autre NG
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Avatar
Serge Nazarian
SAM a écrit le 28/09/2016 :
Le 27/09/16 à 12:18, Serge Nazarian a écrit :
Bonjour,
Est-il possible de faire une fonction foo() en JavaScript qui insère du
code HTML là où elle est appelée. Je m'explique :

oui, bien sûr.
Mais ... est-ce une bonne idée ?
Qui va s'assurer que le visiteur a activé son JS et que le hidden a bien été
créé/effacé ?
Je souhaite insérer un input caché <input type="hidden"
value="ma_valeur"> si on clique sur un bouton.

ce serait mieux si le hidden avait un name, non ?
Le code HTML suivant
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="radio" name="bouton1" value="Non"> Non

Il me semble, mais c'est à vérifier, qu'il n'y a pas besoin de JavaScript,
yaka mettre "ma_valeur" comme valeur du bouton-radio [oui]
et laisser vide celle du bouton [non]
et de se passer de ce hidden !
Normalement le post ne va envoyer que la valeur du bouton coché.
<input type="radio" name="bascule" value="ma_valeur">Oui
<input type="radio" name="bascule" value="" checked> Non
donnerait si le bouton Oui est coché,
<form action="envoi.php" method="post" name="inscription"<br>
...
<input type="radio" name="bouton1" value="Oui" onclick='foo(<input
type="hidden" value="ma_valeur">);'>Oui
<input type="hidden" value="ma_valeur">
<input type="radio" name="bouton1" value="Non"> Non
...
</form>
Mais il faudrait aussi que si, après avoir coché Oui, on coche Non, le
code HTML redevienne (Je souhaite une bascule suivant que Oui ou Non est
coché)

Ne serait-ce pas plus simple d'avoir le hidden toujours là et qu'on se
contente de lui en changer la valeur ?
function bascule() {
var h = document.getElementById('trucmuche'),
v = h.value;
h.value = v=='ma_valeur'? '' : 'ma_valeur';
}
<form>
<input type="radio" name=bouton1" onclick="bascule()">oui
<input type="radio" name=bouton2">non
<input type="hidden" name="trucmuche" id="trucmuche">
</form>
(snip)
Je suis évidemment preneur de toute autre méthode qui permettrait
d'envoyer DEUX valeurs quand UN certain bouton est coché.

<input type="checkbox" onclick="bascule"> d'accord ?
<input type="hidden" name="trucmuche" id="trucmuche">
Cordialement,

Merci pour tout ça.
Je vais essayer.
Cordialement.
--
Serge Nazarian
Pour m'écrire directement : http://cerbermail.com/?ZDkROVSJlu