calendrier php et jquery

**dfournier.pro** · 14/10/2016, 13h11

Bonjour,

Je cherche à modifier mon mode de calendrier pour passer de çà:
Nom : Capture d’écran 2016-10-14 à 13.01.05.png
Affichages : 557
Taille : 116,9 Ko

à çà:

Nom : Capture d’écran 2016-10-14 à 13.00.51.png
Affichages : 515
Taille : 110,7 Ko

Mon code jquery est celui-ci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<script type="text/javascript"> jQuery(function($){ var date = new Date(); var current = date.getMonth()+1; $('.month').hide(); $('#month'+current).show(); $('.months a#linkMonth'+current).addClass('active'); $('.months a').click(function(){ var month = $(this).attr('id').replace('linkMonth',''); if(month != current){ $('#month'+current).slideUp(); $('#month'+month).slideDown(); $('.months a').removeClass('active'); $('.months a#linkMonth'+month).addClass('active'); current = month; } return false; }); }); </script>

Et mon code php est celui-la:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
88
89
90
91
92
 
<section class="calendar">
 
 
 
 
    <?php
 
    require('date.php');
    $date = new Date();
    $year = date('Y');
    $mois = date('m');
    $dates = $date->getAll($year);
    ?>
 
    <h3><a href="#">Agenda <span class="year"><?php echo  $year; ?></span></a></h3>
 
    <div class="periods">
 
        <div class="months">
 
            <ul>
 
 
                <?php foreach ($date->months as $id=>$m): ?>
                    <?php if ($mois == $id+1): ?>
                        <a href="#" id="linkMonth"><i class="fa fa-arrow-left" aria-hidden="true"></i></a>
                        <li><?php echo utf8_encode(utf8_decode($m)); ?></li>
                        <a href="#" id="linkMonth"><i class="fa fa-arrow-right" aria-hidden="true"></i></a>
                    <?php endif; ?>
                <?php endforeach; ?>
 
 
            </ul>
        </div>
        <div class="clear"></div>
        <?php $dates = current($dates); ?>
        <?php foreach($dates as $m=>$days): ?>
 
            <div class="month relative" id="month<?php echo $m; ?>">
                <table>
                    <thead>
                        <tr>
                            <?php foreach($date->days as $d): ?>
                                <th><?php echo substr($d,0,1) ?></th>
 
                            <?php endforeach; ?>
                        </tr>
                    </thead>
 
                    <tbody>
                        <tr>
 
                        <?php $end = end($days); foreach($days as $d=>$w): ?>
                            <?php $time = strtotime("$year-$m-$d"); ?>
 
                            <?php if($d == 1): $nb=$w-1; if($nb>0):?>
                                <td colspan="<?php echo $w-1; ?>" class="padding"></td>
                            <?php endif; ?>
                            <?php endif; ?>
 
                            <td>
                                <div class="relative">
                                    <div class="day"><?php echo $d; ?></div>
                                </div>
 
                                <ul class="events">
 
                                    <?php if(isset($events[$time])): foreach($events[$time] as $e): ?>
                                        <li><?php echo $e; ?></li>
                                    <?php endforeach; endif; ?>
                                </ul>
 
 
 
                            </td>
                            <?php if($w == 7): ?>
                                </tr><tr>
                            <?php endif; ?>
                        <?php endforeach; ?>
 
                        <?php if($end != 7): ?>
                            <td colspan="<?php echo 7-$end; ?>" class="padding"></td>
                        <?php endif; ?>
                        </tr>
                    </tbody>
                </table>
            </div>
 
        <?php endforeach; ?>
    </div>
</section>

Est-ce que l'un d'entre vous pourrait m'aider? Comme vous pouvez le voir, j'ai déjà fais des modifications et j'arrive bien afficher le contenu en cours, mais dès que j'essai de basculer sur un autre mois, çà se corse... J'ai déja essayé plusieurs choses, mais çà me mène à rien de bien concret... Du coup j'ai simplifier le code pour partir sur de bonnes bases.

Merci d'avance pour votre aide.

**dfournier.pro** · 14/10/2016, 17h12

La solution doit se trouver dans cette voie... Reste à trouver le bon ajout à faire pour afficher uniquement le mois en cours (En l'occurence Octobre) avec les petites flèches qui vont bien et qui semblent déjà opérationnelles...

Résultat par image:
Nom : Capture d’écran 2016-10-14 à 17.16.18.png
Affichages : 402
Taille : 97,7 Ko

Nom : Capture d’écran 2016-10-14 à 17.16.18.png
Affichages : 402
Taille : 97,7 Ko

Le jquery quasi inchangé: (J'ai juste ajouté $('.mois').hide(); $('#mois'+current).show()

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<script type="text/javascript"> jQuery(function($){ var date = new Date(); var current = date.getMonth()+1; $('.mois').hide(); $('#mois'+current).show(); $('.month').hide(); $('#month'+current).show(); $('.months a#linkMonth'+current).addClass('active'); $('.months a').click(function(){ var month = $(this).attr('id').replace('linkMonth',''); if(month != current){ $('#month'+current).slideUp(); $('#month'+month).slideDown(); $('.months a').removeClass('active'); $('.months a#linkMonth'+month).addClass('active'); current = month; } return false; }); }); </script>

Et le code php:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
 
 
 
 
<section class="calendar">
 
 
 
 
    <?php
 
    require('date.php');
    $date = new Date();
    $year = date('Y');
    $mois = date('m');
    $dates = $date->getAll($year);
    ?>
 
    <h3><a href="#">Agenda <span class="year"><?php echo  $year; ?></span></a></h3>
 
    <div class="periods">
 
        <div class="months">
            <ul>
 
                    <div class="mois" id="mois<?php echo $mois; ?>">
 
                        <?php foreach ($date->months as $id=>$m): ?>
 
 
                            <li>
                                <a href="#" id="linkMonth<?php echo $id; ?>"><i class="fa fa-arrow-left" aria-hidden="true"></i></a>
                                <?php echo utf8_encode(utf8_decode($m)); ?>
                                <a href="#" id="linkMonth<?php echo $id+2; ?>"><i class="fa fa-arrow-right" aria-hidden="true"></i></a>
                            </li>
 
 
                        <?php endforeach; ?>
 
                    </div>
 
            </ul>
        </div>
        <div class="clear"></div>
        <?php $dates = current($dates); ?>
        <?php foreach($dates as $m=>$days): ?>
 
            <div class="month relative" id="month<?php echo $m; ?>">
                <table>
                    <thead>
                        <tr>
                            <?php foreach($date->days as $d): ?>
                                <th><?php echo substr($d,0,1) ?></th>
 
                            <?php endforeach; ?>
                        </tr>
                    </thead>
 
                    <tbody>
                        <tr>
 
                        <?php $end = end($days); foreach($days as $d=>$w): ?>
                            <?php $time = strtotime("$year-$m-$d"); ?>
 
                            <?php if($d == 1): $nb=$w-1; if($nb>0):?>
                                <td colspan="<?php echo $w-1; ?>" class="padding"></td>
                            <?php endif; ?>
                            <?php endif; ?>
 
                            <td>
                                <div class="relative">
                                    <div class="day"><?php echo $d; ?></div>
                                </div>
 
                                <ul class="events">
 
                                    <?php if(isset($events[$time])): foreach($events[$time] as $e): ?>
                                        <li><?php echo $e; ?></li>
                                    <?php endforeach; endif; ?>
                                </ul>
 
 
 
                            </td>
                            <?php if($w == 7): ?>
                                </tr><tr>
                            <?php endif; ?>
                        <?php endforeach; ?>
 
                        <?php if($end != 7): ?>
                            <td colspan="<?php echo 7-$end; ?>" class="padding"></td>
                        <?php endif; ?>
                        </tr>
                    </tbody>
                </table>
            </div>
 
        <?php endforeach; ?>
    </div>
 
 
 
 
 
 
 
 
</section>
 
<!-- Fragment rendered on {{ 'now'|localizeddate('long', 'long') }} -->

calendrier php et jquery

EDI, CMS, Outils, Scripts et API PHP

Discussions similaires

Partager

Partager