Récupérer la valeur de la ligne selon la valeur du checkbox

Version imprimable

Bonjour à tous,

J'ai un calendrier en html vous pouvez voir le résultat ici http://www.developpez.net/forums/d15...leau-2d-bd/que

Je voudrais maintenant récupérer la valeur des (X,Y) de toutes les checkbox coché.
voici mon code, qui m'affiche pour l'instant que la valeur de la ligne gauche (des jours).
Code:

1 2 3 4 5 6 7 $('.mytable').find('tr').each(function () { var row = $(this); if (row.find('input[type="checkbox"]').is(':checked')){ console.log(row.children('th').text()); } });
Ce que je cherche est pour chaque checkbox cochée récupérer le jour (ligne gauche) et la période (ligne en haut) .

Merci à vous

Code:

1 2 3 4 5 6 $('.mytable').find('tr').each(function () { var row = $(this); row.find('input[type="checkbox"]:checked').each( function(){ console.log(row.children('th').text()); }) });
Code:

row.find('input[type="checkbox"]:checked').each( function(){

peut devenir

Code:

row.find(':checkbox:checked').each( function(){

ou si il n'y a que des checkboxes ...

Code:

row.find(':checked').each( function(){

pour le th a afficher ... faudrait connaitre la structure du html et recupérer le eq()

Merci pour votre réponse.

Voici mon html, jusqu’à présent j’arrive à récupérer la valeur des jours mais pas des périodes.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
<table class="table mytable">
       <thead>
           <tr>
               <th></th>
                   @foreach($periodes as $periode)
                        <th id="{{$periode->id}}">{{$periode->nom}}</th>
                    @endforeach
            </tr>
      </thead>
       <tbody>
             @foreach($jours as $jour)
                   <tr>
                       <th id="{{$jour->id}}">{{$jour->nom}}</th>
                       <td class="center"><input name="value" type="checkbox" class="icheckbox"/></td>
                       <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                       <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                       <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                       <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                       <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                        <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                     </tr>
               @endforeach
         </tbody>
 </table>

Merci.

08/07/2015, 09h38
SpaceFrog

non ce n'est pas du html ...
fournis nous plutôt le html généré

Ca non ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<table  class="mytable">
                        <thead>
                            <tr>
                                <th  id="1"></th>
                                <th  id="2">P.M</th>
                                <th  id="3">Mat.</th>
                                <th  id="4">Midi</th>
                                <th  id="5">A.M.</th>
                                <th  id="6">P.S.</th>
                                <th  id="7">Soir</th>
                                <th  id="8">Nuit</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <th  id="1">Lundi</th>
                                <td class="center"><input name="value" type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
                            <tr>
                                <th  id="2">Mardi</th>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
                            <tr>
                                <th  id="3">Mercredi</th>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
                            <tr>
                                <th  id="4">Jeudi</th>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
                            <tr>
                                <th  id="5">Vendredi</th>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
                            <tr>
                                <th  id="6">Samedi</th>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
                            <tr>
                                <th  id="7">Dimanche</th>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/></td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  name="value"  type="checkbox" class="icheckbox"/> </td>
                                <td class="center"><input name="value"  type="checkbox" class="icheckbox"/> </td>
                            </tr>
 
                       </tbody>
                   </table>

08/07/2015, 13h24
SpaceFrog

en gros un truc comme ça :
http://jsfiddle.net/aud4dhbh/
08/07/2015, 13h48
SpaceFrog

Une autre possibilité plus simple serait de passer par des data-h des input, plus simple au lieu de récupérer l'indexe du tr...

Merci pour ta réponse, par contre ça marche pas dans mon cas, et quand je fais inspecter l'élément avec Chrome je vois ça

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<table style="width: auto;" class="mytable">
       <thead>
                  <tr>
                      <th></th>
                         <th id="1">P.M</th>
                         <th id="2">Mat</th>
                         <th id="3">Midi</th>
                         <th id="4">A.M</th>
                         <th id="5">P.S</th>
                         <th id="6">Soir</th>
                         <th id="7">Nuit</th>
                    </tr>
       </thead>
     <tbody>
              <tr>
                 <th id="1">Lundi</th>
                     <td class="center"><div class="icheckbox_minimal-grey checked" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div></td>
                     <td class="center"><div class="icheckbox_minimal-grey" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> </td>
                      <td class="center"><div class="icheckbox_minimal-grey" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> </td>
                      <td class="center"><div class="icheckbox_minimal-grey" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> </td>
                      <td class="center"><div class="icheckbox_minimal-grey" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> </td>
                      <td class="center"><div class="icheckbox_minimal-grey" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> </td>
                      <td class="center"><div class="icheckbox_minimal-grey" style="position: relative;"><input name="value" type="checkbox" class="icheckbox" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div> </td>
                      <td class="center"><input name="comment" type="text"> </td>
                   </tr>
                     <!-- idem pour le reste des jours -->
 
                      </tbody>
                   </table>

09/07/2015, 09h12
SpaceFrog

Heu ben c'est toi qui a fourni le html plus haut ... ce n'est pas le bon ???
09/07/2015, 09h22
javast

Non c'était pas le bon, je m’excuse :(
09/07/2015, 09h27
SpaceFrog

Avec le nouveau code HTML (:roll:)
https://jsfiddle.net/aud4dhbh/4/
09/07/2015, 14h21
javast

Ça marche, merci beaucoup :)