Forum : cacher/afficher une div

bonjour j'ai realiser un script php où j'affiche un article avec une description. j'ai par la suite limiter le nombre de caractere à 200. je voudrais mettre le système de bouton "lire la suite" pour permettre aux utilisateurs de lire le contenu en entier sans avoir à changer de page. mais a chaque fois que l'on clique sur le bouton la suite apparait juste une seconde et la page est rechargée. voici mon code j'espere etre explicite

<?php try{ require"connectionbd.php"; $reqs="SELECT * FROM ad_eprojet where ownerid=:org"; $ress=$bdd->prepare($reqs); $ress->execute(array('org'=>$id)); $tr1s=$ress->fetch(PDO::FETCH_OBJ); } catch(Exception $e) { echo $e->getMessage().' dans '.$e->getFile().' a la ligne '.$e->getLine(); } if ($tr1s==false) { echo "<div style='text-align:center;margin:10px 0px; color:#ooo;'>Pas de Projets enregistrés pour le moment</div>"; }else{ do{ echo "<article class='post sermon Autorité Yvan art-post'> <header class='post-title'> <div class='row'> <h6>".ucfirst($tr1s->titre)." : <i>".datefrench1($tr1s->date_ajout)."</i></h6> </div> </header> <div class='post-content'> <div class='row'> <div class='col-md-4'> <a href='#' class='media-box'> <img src=".substr($tr1s->image,3)." alt='' title='' class='img-thumbnail'> </a> </div> <div class='col-md-8' id='small'> <p style='word-wrap:break-word;'>".tronquer($tr1s->texte,200)."</p> <p><a href='' id='suite' class='btn btn-primary'>En savoir plus <i class='fa fa-long-arrow-right'></i></a></p> </div>  </div> </div> </article>"; }while($tr1s=$ress->fetch(PDO::FETCH_OBJ)); } //end else ?> --------------- code javascript ------------------------ <script> function masquer(name){ var r= document.getElementById(name); r.style.display="none"; } function afficher(name){ var t= document.getElementById(name); t.style.display="block"; } function affichermasquer(){ masquer("small"); afficher("all"); } function masquerafficher(){ masquer("all"); afficher("small"); } </script>

2 réponses

betaWeb,

il y a 11 ans

Salut,

Alors déjà je vois que tu attribues un ID à ton élément <a href='' id='suite' class='btn btn-primary'>En savoir plus <i class='fa fa-long-arrow-right'></i></a>, sauf que celui-ci est dans une boucle ce qui veut nécessairement dire plusieurs éléments auront le même ID. Et ça c'est pas possible, le principe d'un ID est d'être unique ;)

Ensuite, concernant ton soucis, tu es avares en détails. Sur quel élément cliques-tu pour afficher/masquer ton contenu ? Et surtout, pourquoi est-ce qu'il y a un bout de code commenté dans ton PHP ? Parce que si c'est celui que tu comptes afficher tu es mal barré ! ;)

Bref sois plus précis.

betaWeb,

il y a 11 ans

@alexandreg: Non ça ne fonctionnera pas puisqu'il a plusieurs articles sur la même pas, or un ID est, et je le répète, UNIQUE. A la limite il faut qu'il incrémente un INT et qu'il concatène cette variable à son ID (genre id="tronque-{i}" et id="entier-{i}" là ça fonctionnera.

Mais avec une classe ça fonctionnera tout aussi bien, et simplement avec du CSS et du jQuery ça peut aussi fonctionner: http://codepen.io/anon/pen/PqWGYb/

Tout simplement.