PHP et javascript: masquer un élément...
Résolu/Fermé
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
-
15 juin 2010 à 11:11
Fonx2 Messages postés 331 Date d'inscription dimanche 6 avril 2008 Statut Membre Dernière intervention 5 mai 2013 - 15 juin 2010 à 17:30
Fonx2 Messages postés 331 Date d'inscription dimanche 6 avril 2008 Statut Membre Dernière intervention 5 mai 2013 - 15 juin 2010 à 17:30
A voir également:
- PHP et javascript: masquer un élément...
- Telecharger javascript - Télécharger - Langages
- Easy php - Télécharger - Divers Web & Internet
- Get_magic_quotes_gpc php 8 ✓ - Forum PHP
- Bouton php - Forum PHP
- \R php ✓ - Forum PHP
4 réponses
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
132
15 juin 2010 à 17:30
15 juin 2010 à 17:30
C'est bon! J'ai réussi!
Une petite modif dans le code PHP, qui donne maintenant ceci:
echo "<td class='$ColorCase'><p class='CaseCellule' onMouseOver=\"document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='visible'\" onMouseOut=\"if (document.getElementById('$PrenomPersonne.$j/$m/$y').checked==false) {document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='hidden'}\"><input type='checkbox' name='$PrenomPersonne' class='CaseACocher' id='$PrenomPersonne.$j/$m/$y' value='$PrenomPersonne.$j/$m/$y'></p></td>";
Une petite modif dans le code PHP, qui donne maintenant ceci:
echo "<td class='$ColorCase'><p class='CaseCellule' onMouseOver=\"document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='visible'\" onMouseOut=\"if (document.getElementById('$PrenomPersonne.$j/$m/$y').checked==false) {document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='hidden'}\"><input type='checkbox' name='$PrenomPersonne' class='CaseACocher' id='$PrenomPersonne.$j/$m/$y' value='$PrenomPersonne.$j/$m/$y'></p></td>";
onload=\"document.getElementById('$j$m$y').style.display='none'\"
avec onload le script s'execute uniquement au chargement de la page php. Pour que la case s'affiche au survol de la souris utilise onMouseOver et onMouseOut pour quelle s'efface lorsque la souris n'est plus dessus.
avec onload le script s'execute uniquement au chargement de la page php. Pour que la case s'affiche au survol de la souris utilise onMouseOver et onMouseOut pour quelle s'efface lorsque la souris n'est plus dessus.
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
132
15 juin 2010 à 11:38
15 juin 2010 à 11:38
Oui, mais il faut bien dire que je veux qu'elle soit masquer lors du chargement de la page non (enfin si j'ai bien compris)? Et de toute façon, sa ne me dit pas pourquoi sa ne marche pas!
En admettant que je veuille utiliser onMouseOver et onMouseOut, comment les utiliser?
En admettant que je veuille utiliser onMouseOver et onMouseOut, comment les utiliser?
xMiLeY
Messages postés
68
Date d'inscription
jeudi 3 juin 2010
Statut
Membre
Dernière intervention
15 juin 2010
7
15 juin 2010 à 11:41
15 juin 2010 à 11:41
tu essaye de faire disparaite ta td ou ton p, c'est ta checkbox qu'il faut cacher!
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
132
15 juin 2010 à 11:47
15 juin 2010 à 11:47
Ben en fait, comme la check box est dans le <p>, masquer le <p> masquera la checkbox logiquement et l'avantage, c'est que dès que je survolerai la case (et non pas uniquement la checkbox), la case devrai apparaitre.
Je fais sa parce qu'une case à cocher, c'est pas bien gros...
Je fais sa parce qu'une case à cocher, c'est pas bien gros...
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
132
Modifié par Fonx2 le 15/06/2010 à 11:55
Modifié par Fonx2 le 15/06/2010 à 11:55
Heu... bien sur, j'avais oublié de préciser: si la case à cocher est séléctionné, elle doit resté visible.
Je pensais faire sa avec onSelect...??
Je pensais faire sa avec onSelect...??
si tu fait en sorte que ce soit ton script js qui t'affiche la case, elle ne s'affichera pas avant que ce script soit executé.
dans le cas du onMouse essai :
onMouseOver = "affiche();" onMouseOut = "efface();"
dans le code php affiche le tabeau sans les cases dans une div et utilise l'ajax pour les modifier par exemple grace aux évènements onMouseOver et onMouseOut.
je ne suis pas sur à 100% que ce script fonctionne mais si ça peut t'aider à trouver une solution ... pourquoi pas.
dans le cas du onMouse essai :
onMouseOver = "affiche();" onMouseOut = "efface();"
<script type='text/javascript'>
function affiche()
{
//code pour afficher le tableau avec les checkbox
}
function efface()
{
//code qui affiche le tableau sans les checkbox
}
</script>
dans le code php affiche le tabeau sans les cases dans une div et utilise l'ajax pour les modifier par exemple grace aux évènements onMouseOver et onMouseOut.
je ne suis pas sur à 100% que ce script fonctionne mais si ça peut t'aider à trouver une solution ... pourquoi pas.
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
132
Modifié par Fonx2 le 15/06/2010 à 12:07
Modifié par Fonx2 le 15/06/2010 à 12:07
Bon. J'ai fais des modifs sur le code...
JE me suis dit que par défaut (au chargement donc), les cases devaient être masqué.
Donc, dans mon CSS, j'ai mis display: none;
Maintenant, mes cases sont bien masquer lors du chargement (conseil de kust).
Dans mon code PHP, j'ai mis ceci (encore conseil de kust):
echo "<td class='$ColorCase'><p class='CaseCellule' id='$j$m$y' onMouseOver=\"document.getElementById('$j$m$y').style.display='block'\" onMouseOut=\"document.getElementById('$j$m$y').style.display='none'\"><input type='checkbox' name='$PrenomPersonne' value=''></p></td>";
Le hic, c'est que sa ne marche pas!
Pourquoi?
JE me suis dit que par défaut (au chargement donc), les cases devaient être masqué.
Donc, dans mon CSS, j'ai mis display: none;
Maintenant, mes cases sont bien masquer lors du chargement (conseil de kust).
Dans mon code PHP, j'ai mis ceci (encore conseil de kust):
echo "<td class='$ColorCase'><p class='CaseCellule' id='$j$m$y' onMouseOver=\"document.getElementById('$j$m$y').style.display='block'\" onMouseOut=\"document.getElementById('$j$m$y').style.display='none'\"><input type='checkbox' name='$PrenomPersonne' value=''></p></td>";
Le hic, c'est que sa ne marche pas!
Pourquoi?
xMiLeY
Messages postés
68
Date d'inscription
jeudi 3 juin 2010
Statut
Membre
Dernière intervention
15 juin 2010
7
15 juin 2010 à 12:58
15 juin 2010 à 12:58
Sur le onmouseover, cache ta checkbox et pas le <p>.
la en gros, tu dis de pas afficher la case et onmouseover l'afficher. Mais comment tu veux aller dessus si elle est cachée? =)
la en gros, tu dis de pas afficher la case et onmouseover l'afficher. Mais comment tu veux aller dessus si elle est cachée? =)
Fonx2
Messages postés
331
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
5 mai 2013
132
Modifié par Fonx2 le 15/06/2010 à 17:03
Modifié par Fonx2 le 15/06/2010 à 17:03
Youpiii!!
Sa marche!
Merci xMILeY pour ce bon conseil!
Effectivement, ce n'était pas très cohérent...
Voici le code actuel:
PHP{
echo "<td class='$ColorCase'><p class='CaseCellule' onMouseOver=\"document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='visible'\" onMouseOut=\"document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='hidden'\"><input type='checkbox' name='$PrenomPersonne' class='CaseACocher' id='$PrenomPersonne.$j/$m/$y' value='$PrenomPersonne.$j/$m/$y'></p></td>";
}
CSS {
.CaseCellule {
text-align:center;
margin: 0px 0px 0px 0px;
}
.CaseACocher {
visibility: hidden;
}
}
HTML (résultat) {
<td class=''><p class='CaseCellule' onMouseOver="document.getElementById('Pascal.6/06/2010').style.visibility='visible'" onMouseOut="document.getElementById('Pascal.6/06/2010').style.visibility='hidden'"><input type='checkbox' name='Pascal' class='CaseACocher' id='Pascal.6/06/2010' value='Pascal.6/06/2010'></p></td>
}
Maintenant, au chargement, les cases à coché sont masqué. Lors du survol de la cellule du tableau (le <p>), elles apparaissent. Lorsque le curseurs quitte la cellule, elles disparaissent.
Seul souci maintenant, comment faire pour quel reste afficher lorsqu'elle sont coché? Sur quoi puis-je appuyer la condition et comment écrire la condition?
En tout cas, merci pour votre aide précieuse!
Sa marche!
Merci xMILeY pour ce bon conseil!
Effectivement, ce n'était pas très cohérent...
Voici le code actuel:
PHP{
echo "<td class='$ColorCase'><p class='CaseCellule' onMouseOver=\"document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='visible'\" onMouseOut=\"document.getElementById('$PrenomPersonne.$j/$m/$y').style.visibility='hidden'\"><input type='checkbox' name='$PrenomPersonne' class='CaseACocher' id='$PrenomPersonne.$j/$m/$y' value='$PrenomPersonne.$j/$m/$y'></p></td>";
}
CSS {
.CaseCellule {
text-align:center;
margin: 0px 0px 0px 0px;
}
.CaseACocher {
visibility: hidden;
}
}
HTML (résultat) {
<td class=''><p class='CaseCellule' onMouseOver="document.getElementById('Pascal.6/06/2010').style.visibility='visible'" onMouseOut="document.getElementById('Pascal.6/06/2010').style.visibility='hidden'"><input type='checkbox' name='Pascal' class='CaseACocher' id='Pascal.6/06/2010' value='Pascal.6/06/2010'></p></td>
}
Maintenant, au chargement, les cases à coché sont masqué. Lors du survol de la cellule du tableau (le <p>), elles apparaissent. Lorsque le curseurs quitte la cellule, elles disparaissent.
Seul souci maintenant, comment faire pour quel reste afficher lorsqu'elle sont coché? Sur quoi puis-je appuyer la condition et comment écrire la condition?
En tout cas, merci pour votre aide précieuse!