Appel d'une fonction JavaScript par un bouton "radio"

Eléphant du PHP | 97 Messages

17 janv. 2012, 10:47

Bonjour à tous,

j'aurai voulu savoir comment faire pour appeler une fonction JavaScript dès l'instant où on a coché un bouton de type "radio".

Pour le moment, la création de mon bouton ressemble à ca :
<td><input type="radio" name="adr_generique" value="generique" id="generique"/> <label for="generique">Adresse générique</label></td>
Je pense qu'il faut rajouter un truc du genre "onclick=ma_fonction_a_appeler()" dans la création du bouton, mais quelqu'un disait qu'on pouvait rajouter ceci dans la fonction à appeler :

Code : Tout sélectionner

if (document.getElementById(id_radio).checked) { }
Enfin bref, quelle est la meilleure solution ?

Eléphant du PHP | 209 Messages

17 janv. 2012, 10:49

Salut,

L'évènement se lance par l'attribut onClick (ou autre). La seconde proposition permet de tester si ton bouton radio est coché ou non.

++

Eléphant du PHP | 97 Messages

17 janv. 2012, 11:01

Donc il faut écrire les deux ?

Eléphant du PHP | 209 Messages

17 janv. 2012, 11:10

Je sais pas ce que tu veux faire donc je ne peux pas te dire mais il y a des chances que tu essayes de récupérer la valeur dans la fonction appelée ouais... :roll:

Eléphant du PHP | 97 Messages

17 janv. 2012, 11:17

En fait, à la base, y'a un champ texte où l'utilisateur rentre son adresse email personnelle. Je voudrais que si il coche la case radio, alors ça lui remplace son adresse mail par l'adresse mail générique de la région dans laquelle il travaille.

Par exemple, à la base j'ai écrit "[email protected]". Au final je préfère qu'on puisse m'envoyer des email via la boite mail régionale, donc hop, je clique sur le bouton radio et mon email est remplacé par "[email protected]". Ca sera un moyen d'accélérer la saisie

Eléphant du PHP | 209 Messages

17 janv. 2012, 11:43

Ce serait plutôt une checkbox qu'il te faudra dans ce cas afin de permettre un retour arrière de la saisie.

En gros onClick="ma_fct()"
function ma_fct() {
var radioField = document.getElementById("id_radio");
var textField = document.getElementById("id_field");
if (radioField.checked) textField.value = "[email protected]";
else textField.value = "[email protected]";
}

C'est fait à la louche hein mais l'idée générale est là ;)

Eléphant du PHP | 97 Messages

17 janv. 2012, 14:31

Bon, mon truc fonctionne avec le type "radio" : en gros, je dis que si dans le formulaire de remplissage de la région, l'id correspondant est X, alors tu changes l'adresse perso déjà écrite et tu la remplace par "[email protected]".

Mais, je galère un peu pour faire de même avec la "checkbox" :

Voici pour le moment ma version "checkbox" non fonctionnelle :

le formulaire de remplissage des données :
-On sélectionne la région: liste déroulante avec les 9 régions possibles
<td style="text-align: right;"><label style="font-weight: bold;" for="unite_co">Région</label></td>
	<td>
		<?php
			//On charge la région utilisée dans l'affaire
			if(isset($_SESSION['session_unite_co'])){
				addSelectRegion("region_unite_co", $_SESSION['session_unite_co'],true, false, "", 300,1);
			}
			//Sinon on prend celle de l'auteur
			else{
				if($rowAuteur['nom_region'] == "National"){
					if($_SESSION['session_region_etude']){
						$varregion = $_SESSION['session_region_etude'];
					}
					else{
						$varregion = 1;
					}
				}
				else $varregion = $rowAuteur['id_region'];
				addSelectRegion("region_unite_co", $varregion,true, false, "", 300,1);
			}
		?>
		<span class="champ_obligatoire">*</span></td>
Si besoin est, voici la création de la fonction addSelectRegion :
function addSelectRegion($id, $selected,$afficheNational=true, $afficheToutes=true,$onchange="",$size=0,$mode=0,$disabled=false){
	if($disabled)
		$dis = "disabled";
	else
		$dis = "";
	//Définition de la taille
	if($size==0)
		$attsize = "";
	elseif(is_numeric($size))
		$attsize = "style='width:".$size."px;'";
	//Affichage ou non de l'événement Javascript
	$varonchange = "";
	if($onchange != "")
		$varonchange = 'onchange="'.$onchange.'"';
	//Affichage de la balise
	echo '<select '.$dis.' '.$attsize.' name="'.$id.'" id="'.$id.'" '.$varonchange.'>';
	
	$req_region = 'SELECT id_region, nom_region FROM region ORDER BY nom_region';
	$result_region = mysql_query($req_region) or die('Requête invalide : ' . mysql_error() . "\n" . 'Requête complète : ' . $req_region);
	$padding="";
	if($afficheToutes){
		if(isset($selected) && $selected == "all")$select="selected='selected'"; else $select="";
		echo '<option '.$select.' style="font-weight: bold;" value="all">Toutes les régions</option>
		';
		$padding = 'style="padding-left: 25px;"';
	}
	// Création d'une ligne par région trouvée dans la liste déroulante
	// On lit une par une les lignes issues de la requête
	while ($row_region = mysql_fetch_array($result_region, MYSQL_ASSOC)) {
		if($row_region['nom_region'] != "National" || $afficheNational){
			switch($mode){
				case 0 : $value = $row_region['nom_region']; break;
				case 1 : $value = $row_region['id_region']; break;
				default : $value = $row_region['nom_region']; break;
			}
			// On pré-sélectionne la région choisie dans la page vespa.php
			// On récupère l'adresse correspondante pour l'affichée dans le champ suivant
			if(isset($selected) && ($row_region['nom_region'] == $selected) || ($row_region['id_region'] == $selected)){
				echo '<option '.$padding.' value="' . $value . '" selected="selected">' . $row_region['nom_region'] . '</option>
				';
			}
			// sinon on la rentre simplement dans la liste déroulante
			else{
				echo '<option '.$padding.' value="' . $value . '">' . $row_region['nom_region'] . '</option>
				';
			}
		}
	}
	echo "</select>";
	mysql_free_result($result_region);
	unset($row_region);
}
-Le formulaire de l'adresse email + le bouton checkbox
<td style="text-align: right;"><label for="inter_mail">E-Mail</label></td>

<td><input type="text" name="inter_mail" id="inter_mail" size="45" onKeyUp="javascript:couleur(this);" <?php if(isset($_SESSION['session_inter_mail'])){echo ' value = "' . $_SESSION['session_inter_mail'] . '" ';} ?> /><span class="champ_obligatoire">*</span></td>

<td><input type="checkbox" name="adr_generique" value="generique" id="generique" onClick="modif_email();"/> <label for="generique">Adresse régionale</label></td>
-Ma fonction JavaScript
function modif_email()
		{
			const var email_perso=document.getElementById("inter_mail").value;
			//alert(email_perso);
			if (document.getElementById("generique").checked)
			{
			         var toto=document.getElementById("region_unite_co").value;
			         var email_interlocuteur=document.getElementById("inter_mail").value;
			
			if (toto=='1')//Grand Centre
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='2')//Île-de-France
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='3')//Méditerranée
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='4')//Ouest
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='5')//Rhône-Alpes Auvergne
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='6')//Sud Ouest
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='7')//Nord Ouest
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='8')//Est
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			if (toto=='9')//National
			{
				email_interlocuteur="[email protected]";
				document.formulaire.inter_mail.value="[email protected]";
			}
			}
			else
                        {
				document.formulaire.inter_mail.value=email_perso;
			}
		}
Je pensais (vraisemblablement à tort puisque ca ne m'affiche rien) qu'en utilisant un "const var" sur l'adresse mail, je récupèrerai de manière fixée l'adresse perso de l'utilisateur.

En gros, mon problème, il est dans le retour vers l'adresse perso..

Eléphant du PHP | 97 Messages

17 janv. 2012, 15:02

Il faudrait que je récupère l'email de l'utilisateur via une requête SQL en fait. Mais apparemment quand on combine SQL et JavaScript, ca donne de l'AJAX, et moi l'AJAX, j'ai jamais vu. Pour moi c'est un club de foot d'Amsterdam :)

Eléphant du PHP | 209 Messages

17 janv. 2012, 15:40

Que ce soit un bouton radio ou une checkbox, ça doit fonctionner pareil..

Je te conseille de regarder du côté de jQuery. C'est une librairie qui te permettra de simplifier l'utilisation d'Ajax.

const permet de définir une constante.. Il ne faut que tu la crées en dehors de ta fonction javascript et que tu lui ajoutes la valeur de ta variable mais bon c'est pas top car tu vas avoir du dynamique dans ton javascript.
A ta place, je ferai un champ input hidden plutôt avec une variable defaultMail qui récupère le mail que tu as en session.

Ça donnerait du coup :
<td style="text-align: right;">
	<label for="inter_mail">E-Mail</label>
	<input type="hidden" name="default_mail" value="<?php if(isset($_SESSION['session_inter_mail'])){echo $_SESSION['session_inter_mail'];} ?>" />
</td>
<td>
	<input type="text" name="inter_mail" id="inter_mail" size="45" onKeyUp="javascript&#058;couleur(this);" value="<?php if(isset($_SESSION['session_inter_mail'])){echo $_SESSION['session_inter_mail'];} ?>" />
	<span class="champ_obligatoire">*</span>
</td>
<td>
	<input type="checkbox" name="adr_generique" value="generique" id="generique" onClick="modif_email();"/>
	<label for="generique">Adresse régionale</label>
</td>
Et pour le JS :
function modif_email()
{
	var newMail = document.getElementById("default_mail").value;
	if (document.getElementById("generique").checked)
	{
		var regionValue=document.getElementById("region_unite_co").value;
		
		switch(regionValue) {
			case 1: newMail = "[email protected]";
					break;
			case 2: newMail = "[email protected]";
					break;
			case 3: newMail = "[email protected]";
					break;
			case 4: newMail = "[email protected]";
					break;
			case 5: newMail = "[email protected]";
					break;
			case 6: newMail = "[email protected]";
					break;
			case 7: newMail = "[email protected]";
					break;
			case 8: newMail = "[email protected]";
					break;
			case 9: newMail = "[email protected]";
					break;
		}
	}
	document.getElementById("inter_mail").value = newMail;
}

Eléphant du PHP | 97 Messages

17 janv. 2012, 16:43

ça marche au poil :) merci !