Montrer, cacher un div avec clic sur un lien
Résolu
philip51
Messages postés
49
Date d'inscription
Statut
Membre
Dernière intervention
-
philip51 Messages postés 49 Date d'inscription Statut Membre Dernière intervention -
philip51 Messages postés 49 Date d'inscription Statut Membre Dernière intervention -
bonjour,
Je tourne en rond sur un truc qui me semble simple.
Sur ma page j'ai 2 div une div id="divconsulter" et une div id="divchange"
Dans la div id="divconsulter" j'ai un lien avec un clic qui doit qui doit cacher cette div et afficher la div id="divchange"
le fichier javascript
Les fonctions javascript fonctionnent sur d'autres scripts.
Mon lien récupère bien l'id du nom cliqué.
Merci d'avance
Je tourne en rond sur un truc qui me semble simple.
Sur ma page j'ai 2 div une div id="divconsulter" et une div id="divchange"
Dans la div id="divconsulter" j'ai un lien avec un clic qui doit qui doit cacher cette div et afficher la div id="divchange"
<div id="divconsulter"> <p> <FORM name="research" ACTION = "index.php?page=comodmember" METHOD="POST"> affichage d'un tableau <ital>la ligne qui me pose problème</ital> <td class="trtdChangePass"><span class="marginText"><a href="index.php?page=comodmember&id=<?php echo $M['id'];?>" onclick="cacher('divconsulter'),montrer('divchange')";><?php echo $M['nom'];?> </a></span></td> </FORM> <br /> </div> <?php echo '<div id="divchange">'; echo $id; echo '</div>'; ?>
le fichier javascript
function montrer(id){ document.getElementById(id).style.display = "inline"; } function cacher(id){ document.getElementById(id).style.display = "none"; }
Les fonctions javascript fonctionnent sur d'autres scripts.
Mon lien récupère bien l'id du nom cliqué.
Merci d'avance
A voir également:
- Montrer, cacher un div avec clic sur un lien
- Partager des photos avec un lien - Guide
- Lien url - Guide
- Verifier un lien - Guide
- Cacher ses amis sur facebook - Guide
- Renommer un lien hypertexte - Forum Réseaux sociaux
5 réponses
Bonjour,
Tu poses ta question dans le forum PHP ... mais ça semble d'avantage concerner le Javascript....
Je déplace donc dans le bon forum.
Ensuite... tu as mis onclick sur un lien.... sauf qu'un lien redirige sur une autre page... et donc le onclick ne s'applique pas.
Il faut,
-Soit retirer le href de ton lien
-Soit ajouter du preventDefault() dans tes fonctions JS
Tu poses ta question dans le forum PHP ... mais ça semble d'avantage concerner le Javascript....
Je déplace donc dans le bon forum.
Ensuite... tu as mis onclick sur un lien.... sauf qu'un lien redirige sur une autre page... et donc le onclick ne s'applique pas.
Il faut,
-Soit retirer le href de ton lien
-Soit ajouter du preventDefault() dans tes fonctions JS
Merci pour la réponse.
J'ai donc supprimer le lien
le code HTML
"divconsulter" est bien cachée
mais "divchange" ne s'affiche pas !!
Si je remplace la function voirdiv() par la function montrer() ça fonctionne. Mais je ne veux pas me servir de cette fonction car elle me sert ailleurs tel qu'elle est.
Du coup je ne vois pas si la variable est bien passée !!
J'ai donc supprimer le lien
le code HTML
<div id="divconsulter"> <p> <FORM name="research" ACTION = "index.php?page=comodmember" METHOD="POST"> <td class="trtdChangePass"><span class="marginText" <?php $var= $M['id'];?> onclick="cacher('divconsulter'),voirdiv('divchange')";><?php echo $M['nom'];?></span></td> </div> <div id="divchange"> <input type="text" name="iddunom" value = "toto" >et du texte </div>
function montrer(id){ /*alert(id);*/ document.getElementById(id).style.display = "inline"; } function cacher(id){ document.getElementById(id).style.display = "none"; } function voirdiv(id){ var lid = '<?php echo $id;?>'; document.getElementById.elements['iddunom'].value = lid; document.getElementById(id).style.display = "inline"; }
"divconsulter" est bien cachée
mais "divchange" ne s'affiche pas !!
Si je remplace la function voirdiv() par la function montrer() ça fonctionne. Mais je ne veux pas me servir de cette fonction car elle me sert ailleurs tel qu'elle est.
Du coup je ne vois pas si la variable est bien passée !!
bonjour,
j'ai essayé mais ça ne marche pas. donc j'ai tout repris
la page avec le code html
les 2 premières fonctions sont ok. la 3è ne récupère pas la valeur de l'id
Merci
j'ai essayé mais ça ne marche pas. donc j'ai tout repris
function voirdiv(lid){ document.getElementById.elements['iddunom'].value = lid; document.getElementById(lid).style.display = "inline"; }
la page avec le code html
<?php if (empty($id)){ ?> <div id="divconsulter"> <p> <FORM name="research" ACTION = "index.php?page=comodmember" METHOD="POST"> <td class="trtdChangePass"><span class="marginText" onclick="javascript:cacher('divconsulter'),montrer('divchange'),passerval('<?php $M["id"];?>');"><?php echo $M['nom'];?></span></td> } ?> <br /> </FORM> <br /> </div> <div id="divchange"> <input type="text" name="iddunom" value = "" > <input type="button" name="bouton" value="Retour" onclick="javascript:cacher('divchange'),montrer('divconsulter');" > </div>
les 2 premières fonctions sont ok. la 3è ne récupère pas la valeur de l'id
function montrer(id){ /*alert(id);*/ document.getElementById(id).style.display = "inline"; } function cacher(id){ document.getElementById(id).style.display = "none"; } function passerval(lid){ alert(lid); var lid = '<?php echo $id;?>'; document.getElementById.elements['iddunom'].value = lid; }
Merci
Que vient faire ce bout de code php au milieu de ton js ???
lid est envoyé en paramètre de ta fonction !
var lid = '<?php echo $id;?>';
lid est envoyé en paramètre de ta fonction !
function passerval(lid){ alert(lid); // doit t'afficher la valeur de ton $M['id'] .. ce n'est pas le cas ??? // var lid = '<?php echo $id;?>'; // NE SERT A RIEN !!! document.getElementById.elements['iddunom'].value = lid; }
j'ai modifié la fonction
alert(lid) est bien affiché mais pas de valeur affichée!!
Pourquoi on ne pas récupérer directement la valeur de l'id dans l'input type="text" ?
je remets tout le code de la page php
et les 3 fonctions
alert(lid) est bien affiché mais pas de valeur affichée!!
Pourquoi on ne pas récupérer directement la valeur de l'id dans l'input type="text" ?
je remets tout le code de la page php
<?php require_once "connect.php"; $sessionChoix = !empty($_SESSION['choix']) ? $_SESSION['choix'] : NULL; //prendre la valeur de session si remplie $choix = !empty($_POST['choix']) ? $_POST['choix'] : $sessionChoix; // prendra la valeur de post si elle est remplie, sinon celle de session $_SESSION['choix'] = $choix; $lapage = !empty($_GET['lapage']) ? $_GET['lapage'] : 1; // prend la valeur de la page $_SESSION['lapage'] = $lapage; $id = !empty($_GET['id']) ? $_GET['id'] : ""; // prend l'id de la valeur cliquée sur le tableau : $nom = !empty($_GET['nom']) ? $_GET['nom'] : "";; $prenom = !empty($_GET['prenom']) ? $_GET['prenom'] : ""; $TotalMembres = ''; $membresParPage = 15; $pageActuelle = 1; $nombreDePages = ''; $premiereEntree = 0; $message = ''; $nationalite = ''; $strWhere = ''; // choix de l'affichage switch($choix){ //teste quel choix est sélectionné case "A": $strWhere = "WHERE nationalite = 'Allemande'"; $nationalite = "'Allemande'"; break; case "F": $strWhere = "WHERE nationalite = 'Française'"; $nationalite = "'Française'"; break; // default: case "T": $nationalite = "'Allemande' OR nationalite = 'Française'"; break; } //--------------------------- //comptage des membres selon le choix effectué $sql = "SELECT COUNT(*) AS nb FROM membres " . $strWhere; //compte le nombre de personnes en fonction du choix effectué try{ $req = $cnx->query($sql); $data = $req->fetch(); $TotalMembres = $data['nb']; // récupère le nombre d'enregistrements $nombreDePages = ceil($TotalMembres/$membresParPage); // compte le nombre de pages }catch(Exception $e){ echo "Erreur : " . $e->getMessage(); } //--------------------------- //calcul du nombre de pages et définition de la page actuelle if (isset($_POST['envoyer']) && $choix){ //teste si le bouton envoyer et le choix de la nationalité sont cliqués if (isset($_GET['lapage'])) { // teste si le numéro de la page est cliqué $pageActuelle = intval($_GET['lapage']); // affecte le numéro de la page à la page actuelle if ($pageActuelle > $nombreDePages) { // teste si la page actuelle est supérieure aux nombre de pages $pageActuelle = $nombreDePages; // si oui la page actuelle est égale aux nombre de pages } } else { $pageActuelle = 1; // si le numéro de page n'est pas sélectionné,la page actuelle est la n°1 } $premiereEntree = ($pageActuelle - 1) * $membresParPage; // on calcule la première entrée à lire } else if (isset($_GET['lapage'])) { // teste si la un numéro de page est sélectionné $pageActuelle = intval($_GET['lapage']); if ($pageActuelle > $nombreDePages) { $pageActuelle = $nombreDePages; } $premiereEntree = ($pageActuelle - 1) * $membresParPage; // on calcule la première entrée à lire } //---------------------------- //sélection des membres selon le choix effectué et en fonction de la page actuelle (LIMIT) if (!empty($_SESSION['choix'])){ error_reporting(E_ALL); ini_set('display_errors', TRUE); ini_set('display_startup_errors', TRUE); //préparation de la requête et des variables $sql = "SELECT * FROM membres WHERE nationalite = ".$nationalite." ORDER BY nom, prenom LIMIT ".$premiereEntree.", $membresParPage"; try { $requete = $cnx->prepare($sql); $requete->execute(); $arr_membres = $requete->fetchAll();// on stocke le resultat de la requete dans un array } catch(Exception $e){ // en cas d'erreur dans la requete: echo " Erreur ! ".$e->getMessage(); } } ?> <link rel="stylesheet" type="text/css" href="css/style_connexion.css" /> <!---liaison avec la feuille se style ---> <?php if (empty($id)){ ?> <div id="divconsulter"> <p> <FORM name="research" ACTION = "index.php?page=comodmember" METHOD="POST"> <br /> <p class="pal"> <b> Sélectionner la liste des membres à afficher :</b><br /> <input type="radio" name="choix" Value="T" <?php if($_SESSION["choix"] == "T"){ echo 'checked = "checked"';} ?> class="inputr">Tous * <input type="radio" name="choix" Value="A" <?php if($_SESSION["choix"] == "A"){ echo 'checked = "checked"';} ?> class="inputr">Allemand.e.s <input type="radio" name="choix" Value="F" <?php if($_SESSION["choix"] == "F"){ echo 'checked = "checked"';} ?> class="inputr">Français.e.s <input type="submit" name="envoyer" Value="Afficher" style="cursor:pointer;margin-left:2em;""> <br/> <span class="text1"> * Affichage par défaut</span></p> <!---<b>Pour modifier les données d'un membre, cliquez sur son nom</b><br />---> <?php if(!empty($arr_membres)){ // on s'assure que la variable n'est pas vide puis on écrit la table avec son contenu echo "<b>Pour modifier les données d'un membre, cliquez sur son nom</b><br />"; echo 'Nombre total de membres : '. $TotalMembres .'<br />'; echo '<table class="tableChangePass">'; echo '<tr class="trChangePass"> <td style="width:13em;">NOM</td> <td style="width:9em;border:1px solid;">PRENOM</td> <td style="width:9em;border:1px solid;">TELEPHONE</td> <td style="width:20em;border:1px solid;">ADRESSE INTERNET</td> <td style="width:6em;border:1px solid;">Entrée</td> </TR>'; foreach($arr_membres as $M){ // on boucle dessus à l'aide d'un foreach echo '<tr>';?> <td class="trtdChangePass"><span class="marginText" onclick="javascript:cacher('divconsulter'),montrer('divchange'),passerval('<?php $M["id"];?>');"><?php echo $M['nom'];?></span></td> <td class="trtdChangePass"><span class="marginText"><?php echo $M['prenom'];?></span></td> <td class="trtdChangePass"><span class="marginText"><?php echo $M['telephone'];?></span></td> <td class="trtdChangePass"><span class="marginText"><a href="mailto:<?php echo $M['mail'];?>"><?php echo $M['mail'];?></a></span></td> <td class="trtdChangePass"><span class="marginText"><?php echo $M['entree'];?></span></td></tr> <?php } echo '</table>'; } echo '</p>'; if (!empty($message)){ echo $message; echo '<br />'; } if (empty($message)){ if (!empty($choix)){ for ($i = 1; $i <= $nombreDePages; $i++) { if ($i == $pageActuelle) { echo ' [ '.$i.' ] '; } else { echo '<a href= "index.php?page=comodmember&lapage='.$i.'">'.' '.$i.'</a>'; } } } } } ?> <br /> </FORM> <br /> </div> <div id="divchange"> <input type="text" name="iddunom" value = "" > <input type="button" name="bouton" value="Retour" onclick="javascript:cacher('divchange'),montrer('divconsulter');" > </div>
et les 3 fonctions
function montrer(id){ /*alert(id);*/ document.getElementById(id).style.display = "inline"; } function cacher(id){ document.getElementById(id).style.display = "none"; } function passerval(lid){ alert(lid); document.getElementById.elements['iddunom'].value = lid; }
Et ça... tu le sors d'où ?
Déjà, mets un ID à ton champ input
Ensuite,
NB: A savoir que dans la console de ton navigateur, tu dois voir les erreurs de code.....
Tu aurais donc du t'apercevoir que ton code avait un souci...
document.getElementById.elements['iddunom']
Déjà, mets un ID à ton champ input
<input type="text" name="iddunom" id="iddunom" value = "toto" >et du texte
Ensuite,
document.getElementById('iddunom').value = lid;
NB: A savoir que dans la console de ton navigateur, tu dois voir les erreurs de code.....
Tu aurais donc du t'apercevoir que ton code avait un souci...
faute d'inattention !!
voilà ce qu'indique la console que je comprends pas du tout
"scripts.js:17 Uncaught TypeError: document.getElementById.elements is not
a function
at passerval (scripts.js:17)
at HTMLSpanElement.onclick (index.php?page=comodmember:166)
passerval @ scripts.js:17
onclick @ index.php?page=comodmember:166
document.getElementById.elements['iddunom']
voilà ce qu'indique la console que je comprends pas du tout
"scripts.js:17 Uncaught TypeError: document.getElementById.elements is not
a function
at passerval (scripts.js:17)
at HTMLSpanElement.onclick (index.php?page=comodmember:166)
passerval @ scripts.js:17
onclick @ index.php?page=comodmember:166
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
en cherchant sur la console voilà ce que j'ai trouvé
le problème est sur toujours sur cette ligne
ce qui figure sur la console
donc <?php $M['id'];?> est vide
j'ai modifié cette ligne
je récupère bien la valeur dans alert(lid) de la fonction mais elle ne passe dans l'élément. je cherche
le problème est sur toujours sur cette ligne
<td class="trtdChangePass"><span class="marginText" onclick="javascript:cacher('divconsulter'),montrer('divchange'),passerval('<?php $M["id"];?>');"><?php echo $M['nom'];?></span></td>
ce qui figure sur la console
<td class="trtdChangePass"><span class="marginText" onclick="javascript:cacher('divconsulter'),montrer('divchange'),passerval();"><?php echo $M['nom'];?></span></td>
donc <?php $M['id'];?> est vide
j'ai modifié cette ligne
<td class="trtdChangePass"><span class="marginText" onclick="javascript:cacher('divconsulter'),montrer('divchange'),passerval('<?php echo $M["id"];?>');"><?php echo $M['nom'];?></span></td>
je récupère bien la valeur dans alert(lid) de la fonction mais elle ne passe dans l'élément. je cherche