+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [Résolu][jQuery] Gestion des événements dans un formulaire (/showthread.php?tid=2028)
[Résolu][jQuery] Gestion des événements dans un formulaire - daroth - 17-04-2008
Salut,
me revoilà avec mes problèmes de javascript!
Ce coup ci je veut rendre un formulaire plus agréable à utiliser en faisant apparaître uniquement les parties utiles en fonction de la sélection de checkbox (si la checkbox est coché la partie est visible, si elle est décoché la partie redeviens caché).
Le code du formulaire :
Code PHP :
<?php
<h3><input type='checkbox' name='contrat' id='contrat' /><label for='contrat'>Demande de contrat.</label></h3>
<table id='contrat' style='display:none'>
<tr>
<td>Table pour les contrats</td>
</tr>
</table>
<h3><input type='checkbox' name='tarif' id='tarif' /><label for='tarif'>Demande de tarifs.</label></h3>
<table id='tarif' style='display:none'>
<tr>
<td>Table pour les tarifs</td>
</tr>
</table>
Je sais qu'il faut que j'utilise les méthode show() et hide() pour afficher/cacher les zones de formulaire, par contre c'est la capture de l'évènement sur la checkbox qui me pose problème.
Vos savants conseils me seront donc très utiles pour la résolution de mon problème :good:
Merci d'avance.
++
RE: [JQuery] GEstion des évènement dans un formulaire - Sephi-Chan - 17-04-2008
Je te donne une piste :
Code PHP :
<?php
$('input[name=contrat]').change(function(){
$('table#contrat').toggle();
});
Par contre, je te soupçonne de pas chercher du tout. La documentation est pourtant très claire…
Tout ça pour te conseiller d'y mettre un peu du tiens.
Sephi-Chan
RE: [JQuery] GEstion des évènement dans un formulaire - Anthor - 17-04-2008
Et surtout jamais deux id identiques !
On peux aussi vérifier le statut plus précisément de cette façon :
Code :
var $contrat_status = $('input[name=contrat]').attr('checked')?1:0;RE: [JQuery] GEstion des évènement dans un formulaire - daroth - 17-04-2008
Merci pour la doc française, j'avais pas réussis à la trouver, et vu que je suis d'un niveau très moyen en anglais je n'arrivais pas trop à m'en sortir avec.
Je vais regarder vos pistes de solution puis je vous en reparle.
++
PS : C'est pas seulement les class qui ne doivent pas avoir deux fois le même nom dans un document, il me semble qu'avec les id ça ne pose pas de problèmes ?
RE: [JQuery] GEstion des évènement dans un formulaire - Anthor - 17-04-2008
Raté ! Plusieurs éléments ont la même classe, un Id est unique... Sinon comment identifier !
RE: [JQuery] GEstion des évènement dans un formulaire - daroth - 17-04-2008
Oui je me mélange les pinceaux...
Conclusion : trop coder tue la concentration
Edit :
Voilà mon code actuel :
JQuery :
Code PHP :
<?php
$(document).toggle(
function() {
$("table#tarifForm").show();
},
function() {
$("table#tarifForm").hide();
}
);
Code PHP :
<?php
<h3 class='contrat'><input type='checkbox' name='contrat' class='contrat' id='contratChck' /><label for='contratChck'>Demande de contrat.</label></h3>
<table id='contratForm' style='display:none'>
<tr>
<td>Table pour les contrats</td>
</tr>
</table>
<h3><input type='checkbox' name='tarif' id='tarif' /><label for='tarif'>Demande de tarifs.</label></h3>
<table id='tarifForm' style='display:none'>
<tr>
<td>Table pour les tarifs</td>
</tr>
</table>
J'ai un peu avancé, mais quelques problèmes se posent :
- Maintenant qu'il y a une action sur le clic, les checkbox ne se cochent plus.
- Je n'arrive toujours pas à sélectionner précisément la zone du h3 voulue.
- Je suis sur que je peut généraliser le code en codant quelque chose du genre "rendre visible le tableau qui se trouve dans le même bloc que la checkbox qui vient d'être cochée.", mais là je n'ai pas le moindre idée de comment faire (probablement une utilisation du Xpath et de l'arbre DOM mais...).
++
RE: [JQuery] GEstion des évènement dans un formulaire - Anthor - 17-04-2008
Si tu ne passes pas l'identifiant pour la gestion du click, ton code en l'état n'a aucun effet.
Une fois que ton code fonctionne oui il est très simple de le globaliser
RE: [JQuery] GEstion des évènement dans un formulaire - daroth - 17-04-2008
Que veut tu dire par "l'identifiant pour la gestion du clic" ?
C'est sûrement une bête question de vocabulaire mais là j'arrive pas à comprendre.
RE: [JQuery] GEstion des évènement dans un formulaire - Anthor - 17-04-2008
Je te redonne le code de sephi
Code PHP :
<?php
$('input[name=contrat]').change(function(){
$('table#contrat').toggle();
})
Tu affecte l'événement onchange a l'élément input[name=contrat]