IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Langage PHP Discussion :

Modifier style css en fonction de $_POST


Sujet :

Langage PHP

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Décembre 2005
    Messages
    100
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2005
    Messages : 100
    Par défaut Modifier style css en fonction de $_POST
    Bonjour,

    je développe une page de gestion d'hôtel et je souhaiterai que le choix de la semaine reste illuminé en bleu lorsque $_POST['month'] est définie
    (exactement comme sur le mouse hover). J'ai essayé en mélangeant une condition php IF et du javascript pour modifier le style mais je ne m'en sors pas.

    Si quelqu'un a une idée, je suis preneur.

    Mon code :
    Code html : 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
    <!DOCTYPE html>
    <html lang=fr>
    	<head>
    		<meta charset="utf-8">
    		<meta http-equiv="X-UA-Compatible" content="IE=edge">
    		<meta name="viewport" content="width=device-width, initial-scale=1">
    		<link rel="stylesheet" media="screen" type="text/css" href="css/styles.css"/>
    	</head>
     
    	<body>
    		<?php
                    $year0 = date('Y',strtotime('now - 1 year'));                                   /* définit year n-1 */
                    $year1 = date('Y',strtotime('now'));                                                    /* définit year */
                    $year2 = date('Y',strtotime('now + 1 year'));                                   /* définit year n+1 */
                    $year = !empty($_POST['year']) ? $_POST['year'] : $year1;               /* vérifie si $year est posté */
                    $month = !empty($_POST['month']) ? $_POST['month'] : $year1;    /* vérifie si $month est posté */
                    ?>
    		<!-- Début du formulaire général -->
    		<form method="post" action="index.php" id="hoteldisp">
    			<!-- Menu année / semaine -->
    			<ul id="menu">
    				<li><a href="#">Année <?php echo $year; ?></a>
    					<!-- sous-menu annee n-1, n, n+1 -->
    					<ul>
    					<li><a href="#" onclick="document.getElementById('year').value='<?php echo $year0; ?>';hoteldisp.submit();"><?php echo $year0; ?></a></li>
    					<li><a href="#" onclick="document.getElementById('year').value='<?php echo $year1; ?>';hoteldisp.submit();"><?php echo $year1; ?></a></li>
    					<li><a href="#" onclick="document.getElementById('year').value='<?php echo $year2; ?>';hoteldisp.submit();"><?php echo $year2; ?></a></li>
    					<input type="hidden" name="year" id="year" value="<?php echo $year; ?>">
    					</ul>
    				</li>
    				<!-- Menu semaine -->
    				<li><a href="#" onclick="document.getElementById('month').value='01';hoteldisp.submit();">JANVIER</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='02';hoteldisp.submit();">FÉVRIER</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='03';hoteldisp.submit();">MARS</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='04';hoteldisp.submit();">AVRIL</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='05';hoteldisp.submit();">MAI</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='06';hoteldisp.submit();">JUIN</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='07';hoteldisp.submit();">JUILLET</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='08';hoteldisp.submit();">AÔUT</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='09';hoteldisp.submit();">SEPTEMBRE</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='10';hoteldisp.submit();">OCTOBRE</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='11';hoteldisp.submit();">NOVEMBRE</a></li>
    				<li><a href="#" onclick="document.getElementById('month').value='12';hoteldisp.submit();">DÉCEMBRE</a></li>
    				<input type="hidden" name="month" id="month" value="<?php echo $month; ?>">
    			</ul>
    			<table border="1" width="100%">
    				<tr>
    					<td>&nbsp;</td>
    					<td>Chambre 1</td>
    					<td>Chambre 2</td>
    					<td>Chambre 3</td>
    					<td>Chambre 4</td>
    					<td>Chambre 5</td>
    					<td>Chambre 6</td>
    					<td>Chambre 7</td>
    				</tr>
    				<?php
                                    $date = date("$month-$year"); 
                                    for ($i = 1; $i <= cal_days_in_month(CAL_GREGORIAN,$month,$year) ; $i++)
                                    {
                                            echo "<tr><td>".strftime("%A ", strtotime("$year-$month-$i")).$i.'-'.$date."</td></tr>";
                                    }
                                    ?>
    			</table>
    		</form>
    	</body>
    </html>

    et mon css :

    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
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
     
    /* Principal */
    #menu{
            width: 100%;
            margin: 0;
            padding: 10px 0 0 0;
            list-style: none;
            background: #111;
            background: -moz-linear-gradient(#444, #111);
            background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
            background: -webkit-linear-gradient(#444, #111);
            background: -o-linear-gradient(#444, #111);
            background: -ms-linear-gradient(#444, #111);
            background: linear-gradient(#444, #111);
            -moz-border-radius: 50px;
            border-radius: 50px;
            -moz-box-shadow: 0 2px 1px #9c9c9c;
            -webkit-box-shadow: 0 2px 1px #9c9c9c;
            box-shadow: 0 2px 1px #9c9c9c;
    }
     
    #menu li{
            float: left;
            padding: 0 0 10px 0;
            position: relative;
    }
     
    #menu a{
            float: left;
            height: 25px;
            padding: 0 25px;
            color: #fff;
            text-transform: uppercase;
            font: bold 12px/25px Arial, Helvetica;
            text-decoration: none;
            text-shadow: 0 1px 0 #000;
    }
     
    #menu li:hover > a{
            color: #00d0ff;
    }
     
    *html #menu li a:hover{ /* IE6 */
            color: #00d0ff;
    }
     
    #menu li:hover > ul{
            display: block;
    }
     
    /* Sous-menu */
     
    #menu ul{
        list-style: none;
        margin: 0;
        padding: 0;
        display: none;
        position: absolute;
        top: 35px;
        left: 0;
        z-index: 99999;
        background: #444;
        background: -moz-linear-gradient(#444, #111);
        background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
        background: -webkit-linear-gradient(#444, #111);
        background: -o-linear-gradient(#444, #111);
        background: -ms-linear-gradient(#444, #111);
        background: linear-gradient(#444, #111);
        -moz-border-radius: 5px;
        border-radius: 5px;
    }
     
    #menu ul li{
        float: none;
        margin: 0;
        padding: 0;
        display: block;
        -moz-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
        -webkit-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
        box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
    }
     
    #menu ul li:last-child{
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
     
    #menu ul a{
        padding: 10px;
        height: auto;
        line-height: 1;
        display: block;
        white-space: nowrap;
        float: none;
        text-transform: none;
    }
     
    *html #menu ul a{ /* IE6 */
            height: 10px;
            width: 150px;
    }
     
    *:first-child+html #menu ul a{ /* IE7 */
            height: 10px;
            width: 150px;
    }
     
    #menu ul a:hover{
            background: #0186ba;
            background: -moz-linear-gradient(#04acec,  #0186ba);
            background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
            background: -webkit-linear-gradient(#04acec,  #0186ba);
            background: -o-linear-gradient(#04acec,  #0186ba);
            background: -ms-linear-gradient(#04acec,  #0186ba);
            background: linear-gradient(#04acec,  #0186ba);
    }
     
    #menu ul li:first-child a{
        -moz-border-radius: 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0;
        border-radius: 5px 5px 0 0;
    }
     
    #menu ul li:first-child a:after{
        content: '';
        position: absolute;
        left: 30px;
        top: -8px;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom: 8px solid #444;
    }
     
    #menu ul li:first-child a:hover:after{
        border-bottom-color: #04acec;
    }
     
    #menu ul li:last-child a{
        -moz-border-radius: 0 0 5px 5px;
        -webkit-border-radius: 0 0 5px 5px;
        border-radius: 0 0 5px 5px;
    }
     
    /* Rétablissement du flottement */
    #menu:after{
            visibility: hidden;
            display: block;
            font-size: 0;
            content: " ";
            clear: both;
            height: 0;
    }
     
    * html #menu             { zoom: 1; } /* IE6 */
    *:first-child+html #menu { zoom: 1; } /* IE7 */

  2. #2
    Membre confirmé
    Profil pro
    Inscrit en
    Décembre 2005
    Messages
    100
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2005
    Messages : 100
    Par défaut
    en gros je voudrais éviter de faire :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <li><a href="#" onclick="document.getElementById('month').value='01';hoteldisp.submit();" style="<?php if ($month=="01") { echo 'color:#00d0ff'; }?>">JANVIER</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='02';hoteldisp.submit();" style="<?php if ($month=="02") { echo 'color:#00d0ff'; }?>">FÉVRIER</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='03';hoteldisp.submit();" style="<?php if ($month=="03") { echo 'color:#00d0ff'; }?>">MARS</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='04';hoteldisp.submit();" style="<?php if ($month=="04") { echo 'color:#00d0ff'; }?>">AVRIL</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='05';hoteldisp.submit();" style="<?php if ($month=="05") { echo 'color:#00d0ff'; }?>">MAI</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='06';hoteldisp.submit();" style="<?php if ($month=="06") { echo 'color:#00d0ff'; }?>">JUIN</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='07';hoteldisp.submit();" style="<?php if ($month=="07") { echo 'color:#00d0ff'; }?>">JUILLET</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='08';hoteldisp.submit();" style="<?php if ($month=="08") { echo 'color:#00d0ff'; }?>">AÔUT</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='09';hoteldisp.submit();" style="<?php if ($month=="09") { echo 'color:#00d0ff'; }?>">SEPTEMBRE</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='10';hoteldisp.submit();" style="<?php if ($month=="10") { echo 'color:#00d0ff'; }?>">OCTOBRE</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='11';hoteldisp.submit();" style="<?php if ($month=="11") { echo 'color:#00d0ff'; }?>">NOVEMBRE</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='12';hoteldisp.submit();" style="<?php if ($month=="12") { echo 'color:#00d0ff'; }?>">DÉCEMBRE</a></li>

  3. #3
    Membre émérite
    Homme Profil pro
    Retraité informatique
    Inscrit en
    Juin 2012
    Messages
    519
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Yvelines (Île de France)

    Informations professionnelles :
    Activité : Retraité informatique
    Secteur : High Tech - Matériel informatique

    Informations forums :
    Inscription : Juin 2012
    Messages : 519
    Par défaut
    J'avais trouvé une solution dont je ne connais pas l'auteur et ne peux le remercier. Je pense à Zen Garden peut être.
    Mais cela utilise des cookies
    Pour changer la feuille de style avec un petit script.
    En premier définir des feuilles de style externes avec link et le petit script nécessaire.
    Exemple:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    <title>xxxxx</title>
    <link rel="stylesheet" 			 type="text/css" href="css/defaut.css" media="screen" title="defaut" />
    <link rel="alternate stylesheet" type="text/css" href="css/switch1.css" media="screen" title="switch1" />
    <link rel="alternate stylesheet" type="text/css" href="css/switch2.css" media="screen" title="switch2" />
    <link rel="alternate stylesheet" type="text/css" href="css/switch3.css" media="screen" title="switch3" />
    <script type="text/javascript" src="js/switch.js"></script>
    Puis j'utilise un menu ou toute autre solution:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    <ul>
            <li><a href="javascript:setActiveStyleSheet('defaut');">Sans style</a></li>
            <li><a href="javascript:setActiveStyleSheet('switch1');">Style1</a></li>
            <li><a href="javascript:setActiveStyleSheet('switch2');">Style2</a></li>
            <li><a href="javascript:setActiveStyleSheet('switch3');">Style3</a></li>
        </ul>
    Enfin le script externe appelé.
    switch.js
    Code script : 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
    // JavaScript Document
    ////////////////////////////////////////
    /////////SWITCHEUR DE STYLES////////////
    ////////////////////////////////////////
    function setActiveStyleSheet(titre){
    for (i=0; a=document.getElementsByTagName("link")[i]; i++){
     if (a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")){
      a.disabled = true;
      if (a.getAttribute("title") == titre){
       a.disabled = false;
      }
        }
    }
    createCookie(titre);
    }
    ///////////////////////////////////////
    ///////////CREATION DU COOKIE//////////
    ///////////////////////////////////////
    function createCookie(titre){
    var site = "www.monsite.com";
    var date_exp = new Date();
    date_exp.setTime(date_exp.getTime()+(365*24*3600*1000));
    document.cookie="style="+titre+"; expires="+date_exp.toGMTString()+"; path=/; domain="+site;
    }
    ///////////////////////////////////////
    /////////LECTURE DU COOKIE/////////////
    ///////////////////////////////////////
    function getCookieVal(offset){
    var endstr=document.cookie.indexOf(";", offset);
    if (endstr==-1){
     endstr=document.cookie.length;
    }
    return unescape(document.cookie.substring(offset, endstr));
    }
     
    function GetCookie(i){
    var arg=i+"=";
    var alen=arg.length;
    var clen=document.cookie.length;
    var i=0;
    while (i<clen){
     var j=i+alen;
     if (document.cookie.substring(i, j)==arg){
      return getCookieVal(j);
     }
     i=document.cookie.indexOf(" ",i)+1;
     if (i==0){
      break;
     }
    }
    return null;
    }
    ////////////////////////////////////////
    ////PENDANT LE CHARGEMENT DE LA PAGE////
    ////////////////////////////////////////
    var titre = GetCookie("style");
    if (titre == null){
    titre="defaut";
    }
    setActiveStyleSheet(titre);
    Voila peut être cela peut t'aider.

  4. #4
    Invité
    Invité(e)
    Par défaut
    Bonjour,

    c'est plutôt une problématique PHP que CSS.
    En l'occurence : optimiser le code PHP.

    Pour ce qui est du CSS, il est préférable d'ajouter une classe CSS plutôt que du CSS en ligne.




    Je déplace dans le forum PHP.

  5. #5
    Invité
    Invité(e)
    Par défaut
    Bon.

    1/ Maintenant, on voit comment optimiser ce bout de code :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <li><a href="#" onclick="document.getElementById('month').value='01';hoteldisp.submit();" style="<?php if ($month=="01") { echo 'color:#00d0ff'; }?>">JANVIER</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='02';hoteldisp.submit();" style="<?php if ($month=="02") { echo 'color:#00d0ff'; }?>">FÉVRIER</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='03';hoteldisp.submit();" style="<?php if ($month=="03") { echo 'color:#00d0ff'; }?>">MARS</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='04';hoteldisp.submit();" style="<?php if ($month=="04") { echo 'color:#00d0ff'; }?>">AVRIL</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='05';hoteldisp.submit();" style="<?php if ($month=="05") { echo 'color:#00d0ff'; }?>">MAI</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='06';hoteldisp.submit();" style="<?php if ($month=="06") { echo 'color:#00d0ff'; }?>">JUIN</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='07';hoteldisp.submit();" style="<?php if ($month=="07") { echo 'color:#00d0ff'; }?>">JUILLET</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='08';hoteldisp.submit();" style="<?php if ($month=="08") { echo 'color:#00d0ff'; }?>">AÔUT</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='09';hoteldisp.submit();" style="<?php if ($month=="09") { echo 'color:#00d0ff'; }?>">SEPTEMBRE</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='10';hoteldisp.submit();" style="<?php if ($month=="10") { echo 'color:#00d0ff'; }?>">OCTOBRE</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='11';hoteldisp.submit();" style="<?php if ($month=="11") { echo 'color:#00d0ff'; }?>">NOVEMBRE</a></li>
    <li><a href="#" onclick="document.getElementById('month').value='12';hoteldisp.submit();" style="<?php if ($month=="12") { echo 'color:#00d0ff'; }?>">DÉCEMBRE</a></li>
    En PHP, il existe les array. Bien pratique :
    Code php : 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
    <?php	// mois
    	$mois_array = array(
    		'01' => 'JANVIER',
    		'02' => 'FÉVRIER',
    		'03' => 'MARS',
    		'04' => 'AVRIL',
    		'05' => 'MAI',
    		'06' => 'JUIN',
    		'07' => 'JUILLET',
    		'08' => 'AÔUT',
    		'09' => 'SEPTEMBRE',
    		'10' => 'OCTOBRE',
    		'11' => 'NOVEMBRE',
    		'12' => 'DÉCEMBRE'
    		);
    	foreach( $mois_array as $mois_id => $mois_nom )
    	{
    		$is_active = ($month == $mois_id)? ' class="active"' : '';
     
    ?>
    	<li><a href="#" onclick="document.getElementById('month').value='<?php echo $mois_id; ?>';hoteldisp.submit();" <?php echo $is_active; ?>><?php echo $mois_nom; ?></a></li>
    <?php
    	}
    ?>
    N.B. J'ai remplacé le style CSS en ligne par une classe.


    2/ A mon avis, tu a un bug ici ($year1 ??):
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
                    $month = !empty($_POST['month']) ? $_POST['month'] : $year1;    /* vérifie si $month est posté */
    Dernière modification par Invité ; 04/02/2017 à 20h10.

  6. #6
    Membre confirmé
    Profil pro
    Inscrit en
    Décembre 2005
    Messages
    100
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2005
    Messages : 100
    Par défaut
    Merci à tous pour vos réponses.

    -> nosmoking

    Ok pour l'écouteur sur le ul, en effet c'est plus logique

    -> jefreb

    pas mal le code mais je crois que la solution de jreaux62 est plus adaptée à ce que je souhaite

    -> jreaux62

    j'ai modifié mon code et créer ma classe "active", mais pas de changement de couleur ... je cherche mon erreur.

    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
    <!DOCTYPE html>
    <html lang=fr>
    	<head>
    		<meta charset="utf-8">
    		<meta http-equiv="X-UA-Compatible" content="IE=edge">
    		<meta name="viewport" content="width=device-width, initial-scale=1">
    		<link rel="stylesheet" media="screen" type="text/css" href="css/styles.css"/>
    	</head>
     
    	<body>
    		<?php
    		$year0 = date('Y',strtotime('now - 1 year'));					/* définit year n-1 */
    		$year1 = date('Y',strtotime('now'));							/* définit year */
    		$year2 = date('Y',strtotime('now + 1 year'));					/* définit year n+1 */
    		$month1 = date('m',strtotime('now'));
    		$year = !empty($_POST['year']) ? $_POST['year'] : $year1;		/* vérifie si $year est posté */
    		$month = !empty($_POST['month']) ? $_POST['month'] : $month1;	/* vérifie si $month est posté */
     
    		?>
    		<!-- Début du formulaire général -->
    		<form method="post" action="index.php" id="hoteldisp">
    			<!-- Menu année / semaine -->
    			<ul id="menu">
    				<li><a href="#" style="color:yellow">Année <?php echo $year; ?></a>
    					<!-- sous-menu annee n-1, n, n+1 -->
    					<ul>
    					<li><a href="#" onclick="document.getElementById('year').value='<?php echo $year0; ?>';hoteldisp.submit();"><?php echo $year0; ?></a></li>
    					<li><a href="#" onclick="document.getElementById('year').value='<?php echo $year1; ?>';hoteldisp.submit();"><?php echo $year1; ?></a></li>
    					<li><a href="#" onclick="document.getElementById('year').value='<?php echo $year2; ?>';hoteldisp.submit();"><?php echo $year2; ?></a></li>
    					<input type="hidden" name="year" id="year" value="<?php echo $year; ?>">
    					</ul>
    				</li>
    				<!-- Menu semaine -->
    				<?php
    				/*tableau des mois*/
    				$mois_array = array(
    					'01' => 'JANVIER',
    					'02' => 'FÉVRIER',
    					'03' => 'MARS',
    					'04' => 'AVRIL',
    					'05' => 'MAI',
    					'06' => 'JUIN',
    					'07' => 'JUILLET',
    					'08' => 'AÔUT',
    					'09' => 'SEPTEMBRE',
    					'10' => 'OCTOBRE',
    					'11' => 'NOVEMBRE',
    					'12' => 'DÉCEMBRE'
    				);
    				foreach( $mois_array as $mois_id => $mois_nom ) {
    					$is_active = ($month == $mois_id) ? ' class="active"' : '';
    					?>
    					<li><a href="#" onclick="document.getElementById('month').value='<?php echo $mois_nom; ?>';hoteldisp.submit();" <?php echo $is_active; ?>"><?php echo $mois_nom; ?></a></li>
    					<input type="hidden" name="month" id="month" value="<?php echo $month; ?>">
    				<?php
    				}
    				?>
    			</ul>
    			<table border="1" width="100%">
    				<tr style="text-align:center">
    					<td>&nbsp;</td>
    					<td>Chambre 1</td>
    					<td>Chambre 2</td>
    					<td>Chambre 3</td>
    					<td>Chambre 4</td>
    					<td>Chambre 5</td>
    					<td>Chambre 6</td>
    					<td>Chambre 7</td>
    				</tr>
    				<?php
    				setlocale(LC_TIME, 'fr', 'fr_FR', 'fr_FR.ISO8859-1'); /*on definit la langue fr*/
    				for ($i = 1; $i <= cal_days_in_month(CAL_GREGORIAN,$month,$year) ; $i++) /*boucle les jours du mois*/
    				{
    					echo "<tr id='calrow'><td>".ucfirst(strftime("%A ", strtotime("$year-$month-$i"))).$i."</td> <!--affiche les jours du mois-->
    					<td>&nbsp;</td> <!-- colonne chambre 1 -->
    					<td>&nbsp;</td> <!-- colonne chambre 2 -->
    					<td>&nbsp;</td> <!-- colonne chambre 3 -->
    					<td>&nbsp;</td> <!-- colonne chambre 4 -->
    					<td>&nbsp;</td> <!-- colonne chambre 5 -->
    					<td>&nbsp;</td> <!-- colonne chambre 6 -->
    					<td>&nbsp;</td> <!-- colonne chambre 7 -->
    					</tr>";
    				}
    				?>
    			</table>
    		</form>
    	</body>
    </html>

  7. #7
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 198
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 198
    Par défaut
    Bonjour,
    - concernant le CSS : il me semble que le plus simple est de gérer cela au sein d'une boucle dans ton code PHP, si le mois est le mois en cours alors tu lui affectes une classe.

    - concernant le javascript : onclick="document.getElementById('month').value='01';hoteldisp.submit();", autant metrte l'écouteur sur le parent <ul>.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Modifier styles CSS avec JS
    Par Rmodevv dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 14/05/2013, 09h47
  2. [2.x] Modifier style CSS depuis symfony
    Par pmithrandir dans le forum Symfony
    Réponses: 0
    Dernier message: 30/11/2012, 12h43
  3. Modifier style par un css
    Par reportPer dans le forum BIRT
    Réponses: 0
    Dernier message: 21/12/2009, 11h39
  4. Réponses: 3
    Dernier message: 07/04/2009, 21h39
  5. Modifier un style css dynamiquement
    Par arnolem dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 26/05/2006, 10h17

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo