Bonjour,

J'ai suivi le tuto " Créer un calendrier" ici, tout est ok mais je souhaiterais aussi qu'à l'arrivée sur la page du calendrier il affiche <u>le mois courant</u> et pas par défaut le mois de janvier.
Etant plutôt débutant en JS, je ne sais pas trop comment me débrouiller.

Dans les commentaires du tuto, qqn pose exactement la même question que moi et la piste serait de "simplement procéder comme quand on récupère le jour d'aujourd'hui. Mais avec le mois" ...Malhrsmt je ne m'en sors pas davantage. :(

Pour celles et ceux qui auraient mis en place cette solution, si vous pouviez me filer un ptit coup d'main ... :)

Merci par avance.

Claw69

13 réponses


Déja la première étape est d'arriver à mettre une class particulière au mois courant en PHP tu y arrive ?

Claw69
Auteur

Merci Grafikart pour ton retour... :)

Quelque chose qui ressemblerait à ça ? ==>

foreach($dates as $m=>$days)  
{
    $month_read = strtotime("$m"); //timestamp du mois lu
    ?>

    <div <?php 
        if ($month_read == strtotime(date('m'))) // si mois lu = mois actuel
        {?>
            class="current_month" id="month<?php echo $m; ?>" // appel de la classe particulière "current_month"
            <?php
        }
        else
        {?>
            class="month" id="month<?php echo $m; ?>"
        <?php
        }
        ?>
        >

            <table>

           (......)
<?php
}
?>

Tu ferais un ternaire, tu gagnerai des lignes.

Claw69
Auteur

Je suis d'accord mais pour l'instant je préfère faire "old school" car à mes yeux c'est + facilement lisible/compréhensible...

une idée sur mon problème sinon... ;)

Ton code marche, je veux dire il met bien la class current_month au bon mois ?

Claw69
Auteur

Oui ça met bien la class "current_month"...

Au passage j'ai changé tout le code que j'ai présenté dans mon 1er message et je l'ai remplacé par le code ci-dessous (supposant que strtotime n'était pas la solution étant donné que je n'utilise pas une date mais le mois seulement):

$current_month = date('n');
foreach($dates as $m=>$days)  
{
    ?>          

    <div <?php if ($m == $current_month) // si mois lu = mois actuel
           {?>
            class="current_month" id="month<?php echo $m; ?>"
                   <?php
           }
           else
           {?>
                class="month" id="month<?php echo $m; ?>"
           <?php
           }
           ?>
           >

          <table> 
                    (.....)
<?php  
}  
?>

Que dois-je faire ensuite ?

Merci bcp par avance.

(sachant au passage que mon objectif final serait de pouvoir gérer plusieurs années du style : j'affiche par défaut l'année-mois courant comme actuellement (enfin qd ça marchera) et j'aurais la possibilité ensuite de sélectionner une autre année via clic sur flèches "suivante-précédente" (qui entoureraient l'année affichée par exemple) ou autre solution j'en sais rien.... à part ça je ne demande pas grand chose ! ;)

Bonsoir,

j'ai suivi le tuto pour "créer un calendrier" mais je n'arrive pas à charger Jquery pour utiliser les fonctions???
J'utilise Wamp et j'ai essayé avec l'adresse complète du lien JQuery mais j'ai aussi télécharger le .js pour l'avoir dans mon dossier "calendrier". Le problème c'est que l'un et l'autre ne permettent pas d’exécuter le code de jQuery...

Comment faire pour que jQuery soit activé.

Merci

Bonne soirée

PEPE

Claw69
Auteur

un ptit up :)

qqn aurait une idée?
merci bcp par avance.

@PEPE: as-tu résolu ton pb ?

Coucou à tous,

c bon j'ai réussi en fait j'avais laissé un espace entre la variable et la balise. Donc c pas la faute de Jquery.

Bonne continuation

PEPE

Salut Claw69,
Je me suis penché sur ton problème vu que je voulais faire la même chose que toi ;)
Donc j'ai démarrer par ta piste.

Au niveau du fichier qui affiche le calendrier :
1ere étape - Mettre en rouge le mois en cours.

<div class="months">
    <ul>
        <?php foreach ($calendar->months as $id=>$m): ?>
        <li><a href="#" <?php if($id+1==$current_month){ echo "class='current_title'";}?>id="linkMonth<?php echo $id+1; ?>"><?php echo substr(utf8_decode($m),0,3); ?></a></li>
        <?php endforeach; ?>
    </ul>
</div>

Sur le calendrier de base j'ai donc rajouter cette ligne :
<?php if($id+1==$current_month){ echo "class='current_title'";}?>

Qui attribut la classe si c'est le mois courant (Tu verra après où je vais l'utiliser)

2ème étape : Afficher le mois en cours
Donc ici j'ai repris ton idée

<?php foreach ($calendars as $m=>$days): ?>
      <div class="<strong><?php if($m == $current_month) echo "current_month month relative"; else echo "month relative"; ?></strong>" id="month<?php echo $m; ?>">
<table id="calendar">
(.....)

J'ai laisser les classes 'month' et 'relative' afin de ne pas perturber le CSS, j'ai juste ajouter la classe current_month

Ensuite dans le fichier JS :

$('.month').hide();
$('.current_month:first').show();

On cache tout les mois, puis on affiche celui avec la classe 'current_month'

Puis :

$('.months .current_title:first').addClass('active');

On ajoute la classe 'active' seulement aux éléments ayant la classe current_title ;)

Voila j'ai essayé d’être le plus clair possible :)
En esperant t'avoir aidé.

En reprenant ce que grafiArt à fait, j'ai fait ça :

jQuery(function($){
    var date = new Date();
    var currentMonth = date.getMonth()+1;

    $('.month').hide();
    $('#tabMonth'+currentMonth).show();

    $('.listMonths a#linkMonths'+currentMonth).css("color","red");

    $('.listMonths a').click(function(){
        var month = $(this).attr('id').replace('linkMonths', '');
        if(month!=currentMonth)
        {
            $('#tabMonth'+currentMonth).slideUp(),
            $('#tabMonth'+month).slideDown();
            $('.listMonths a#linkMonths'+currentMonth).css("color","black");
            $('.listMonths a#linkMonths'+month).css("color","red");
            currentMonth = month;
        }
        return false;
    });

}
);

J'ai pas changé grand chose mis à part le début, qui t'affichera le mois courrant comme tu le souhaite

Bonjour Nohman, ton code n'a pas l'aire de fonctionner. Il faut remplacer la fonction jQuery uniquement ?
Quelqu'un peut m'apporter une réponse simple de l'élément à modifier en s'appuyant sur ce qui a été fait par Grafikart SVP.

Avec beaucoup de retard.
Bah écoute ça marche chez moi ^^.
L'idée c'est de créer une variable qui contient le chiffre du mois courrant et de rajouter un car le premier moi (janvier) commence à 0. Et dans ton tableau de moi, techniquement tu as mis 1, 2, 3, etc ... pour chaque mois de l'année.

var date = new Date();
var currentMonth = date.getMonth()+1;

Après tu affiches le mois que tu veux grâce à ta variable date en JS.

$('.month').hide();
    $('#tabMonth'+currentMonth).show();