PHP|Débutant :: Forums

patrokos

Membre

Inscription : 16-08-2015

Messages : 1

Problème champ date dans tableau php et DB.

Bonjour,
Je suis débutant avec php et j'ai des soucis.
J'ai créé une base de données qui se nome CDSD.
Mon souci est que je n'arrive pas à alimenter mon champ date dans ma DB depuis ma page php. Quand je clic sur mon champ date, un calendrier s'ouvre mais quand je choisi la date, elle ne s'affiche pas dans mon tableau. Les autres champs aucun problème.
Il y a certainement un truc qui cloche mais ... j'avoue je suis perdu.

Voici mon code.

<style type="text/css">
  /*###### Bouton gauche des mois ######*/
  .MonthLeft{
    width:14px;
    height:50px;
    background:url('images/static.png') -112px -250px;
    position:absolute;
    left:-2px;
    top:0px;
  }
  .MonthLeftOver{
    width:14px;
    height:50px;
    background:url('images/static.png') -126px -250px;
    position:absolute;
    left:-2px;
    top:0px;
  }
  .MonthLeftClick{
    width:14px;
    height:50px;
    background:url('images/static.png') -140px -250px;
    position:absolute;
    left:-2px;
    top:0px;
  }
  /*###### Bouton droit des mois ######*/
  .MonthRight{
    width:14px;
    height:50px;
    background:url('images/static.png') -154px -250px;
    position:absolute;
    right:-2px;
    top:0px;
  }
  .MonthRightOver{
    width:14px;
    height:50px;
    background:url('images/static.png') -168px -250px;
    position:absolute;
    right:-2px;
    top:0px;
  }
  .MonthRightClick{
    width:14px;
    height:50px;
    background:url('images/static.png') -182px -250px;
    position:absolute;
    right:-2px;
    top:0px;
  }
 
  /*###### Bouton haut des années ######*/
 
  .YearTop{
    width:14px;
    height:25px;
    background:url('images/static.png') -196px -250px;
    position:absolute;
    right:-2px;
    top:0px;
  }
  .YearTopOver{
    width:14px;
    height:25px;
    background:url('images/static.png') -210px -250px;
    position:absolute;
    right:-2px;
    top:0px;   
  }
  .YearTopClick{
    width:14px;
    height:25px;
    background:url('images/static.png') -224px -250px;
    position:absolute;
    right:-2px;
    top:0px;   
  }
  /*###### Bouton bas des années ######*/
 
  .YearBottom{
    width:14px;
    height:25px;
    background:url('images/static.png') -196px -275px;
    position:absolute;
    right:-2px;
    bottom:0px;  
  }
  .YearBottomOver{
    width:14px;
    height:25px;
    background:url('images/static.png') -210px -275px;
    position:absolute;
    right:-2px;
    bottom:0px;    
  }
  .YearBottomClick{
    width:14px;
    height:25px;
    background:url('images/static.png') -224px -275px;
    position:absolute;
    right:-2px;
    bottom:0px;    
  }
  /*###### conteneur principal ######*/
  .calendar{
    width:300px;
    height:250px;
    background:url('images/static.png') no-repeat;
    position:absolute;
    left:400px;
    font-weight:bold;
    font-family:Tahoma,"Lucida Grande",Verdana,Arial,Helvetica,sans-serif;
    font-size:11px;
    text-align:center;
  }
 
  .contentMonth{
    width:130px;
    height:50px;
    background:url('images/static.png') -100px -300px repeat-x;
    position:absolute;
    left:85px;
    top:5px;
  }
  .pMonth{
    width:130px;
    height:50px;
    line-height:50px;
    display:block;
  }
  .contentDay{
    width:56px;
    height:50px;
    line-height:25px;
    text-align:center;
    background:url('images/static.png') 0px -250px;
    position:absolute;
    left:15px;
    top:5px;
  }
  .contentYear{
    width:56px;
    height:50px;
    background:url('images/static.png') -56px -250px;
    position:absolute;
    left:230px;
    top:5px;
  }
  .pYear{
    width:42px;
    height:50px;
    line-height:50px;
    display:block;
  }
  .contentListDay{
    width:290px;
    height:155px;
    overflow:hidden;
    position:absolute;
    left:5px;
    top:90px;

  }
  .contentListDay ul{
    width:100%;
    height:100%;
    position:absolute;
    margin:0px;
    padding:2px 0px 0px 1px;
  }
  .dayCurrent{
    width:41px;
    height:25px;
    line-height:25px;
    display:block;
    float:left;
    text-align:center;
    color:#000000;
    font-weight:bold;
    background:url('images/static.png') -41px -352px;
  }
  .liOut{
    width:41px;
    height:25px;
    line-height:25px;
    display:block;
    float:left;
    text-align:center;
    color:#000000;
    font-weight:bold;
    background:url('images/static.png') 0px -352px;
    cursor:pointer;
  }
  .liHover{
    width:41px;
    height:25px;
    line-height:25px;
    display:block;
    float:left;
    text-align:center;
    color:#000000;
    font-weight:bold;
    background:url('images/static.png') -41px -352px;
    cursor:pointer;
  }
  .liInactive{
    width:41px;
    height:25px;
    line-height:25px;
    display:block;
    float:left;
    text-align:center;
    color:#000000;
    font-weight:bold;
    background:url('images/static.png') -82px -352px;
  }
  .contentNameDay{
    width:290px;
    height:27px;
    line-height:27px;
    overflow:hidden;
    position:absolute;
    left:5px;
    top:63px;
    padding:0px;
    margin:0px;
    list-style:none;
  }
 
  .contentNameDay li{
    width:41px;
    display:block;
    float:left;
    text-align:center;
    color:#000000;
    font-weight:bold;
  }

  .bugFrame{
    position:absolute;
    top:0px;
    left:0px;
    background:url('images/static.png') no-repeat;
    z-index:0;
    width:100%;
    height:100%;
    border:0px;
  }
</style>
<script type="text/javascript">
  var calendarTemp, calendarElement, calendarDestruct = false, preventDouble = true;
  document.onclick = function(e){
    var source=window.event?window.event.srcElement:e.target;
    if(!source.calendrier && calendarDestruct && preventDouble){
      calendarDestruct = false;
      calendarElement.calendarActive = false;
      while (document.getElementById('Calendrier').childNodes.length>0) {
        document.getElementById('Calendrier').removeChild(document.getElementById('Calendrier').firstChild);
      }
      document.body.removeChild(document.getElementById('Calendrier'));
    }
    else if(!preventDouble){preventDouble = true}
  }
  function calendar(element){
    if(document.getElementById('Calendrier') && element != calendarElement){
      while (document.getElementById('Calendrier').childNodes.length>0) {
        document.getElementById('Calendrier').removeChild(document.getElementById('Calendrier').firstChild);
      }
      document.body.removeChild(document.getElementById('Calendrier'));
      calendarElement.calendarActive = false;
      preventDouble = false;
    }
    else{preventDouble = true;}
    calendarTemp = element;
    if(!calendarElement){calendarElement = element}
    if(!element.calendarActive){
    //Propriété de la date ( année , mois etc ... )
    this.monthCurrent = null;
    this.yearCurrent = null;
    this.dayCurrent = null;
    this.dateCurrent = null;
    //Le timer pour les effet ( fade in ^^ )
    this.timer = null;
    /*###### Objet composant le calendrier ######*/
    // la div principale
    this.calendar = null;
   
    this.bugFrame = null;
    //div contenant les mois ainsi que les deux boutons suivant et précédent
    this.contentMonth = null;
    this.pMonth = null;
    this.MonthLeft = null;
    this.MonthRight = null;
   
    //Div contenant l'année ainsi que les deux boutons
    this.contentYear = null;
    this.pYear = null;
    this.YearTop = null;
    this.YearBottom = null;
   
    //Div contenant le nom des jours
    this.contentNameDay = null;
   
    //Div contenant la liste des jours
    this.contentListDay = null;
   
    /*###### FIN des Objet du calendrier ######*/
   
    //Liste des dates courantes
    this.from = null;
    //Liste des dates suivantes
    this.to = null;
   
    this.opacite = 0 ;
    this.direction = null;
    //Variable permettant de mettre a  jour le header + slide
    this.inMove = false;
    //Tableau d'élément a déplacé
    this.elementToSlide = new Array();
    //Index de l'élément en cours
    this.currentIndex = 0;
    //Paramètre pour lancement automatique
    this.timePause = 0 ; //permet de définir le temps de pause entre deux slide
    this.auto = false ; //Permet d'activer ou non le slide automatique
 
    //Input sur lequel on a cliqué
    this.element = (element) ? element: null;
    element.calendarActive = true;
    //Tableaux contenant le nom des mois et jours
    this.monthListName = new Array('Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre');
    this.dayListName = new Array('Lu','Ma','Me','Je','Ve','Sa','Di');
    this.dayFullName = new Array('Lun','Mar','Mer','Jeu','Ven','Sam','Dim');
     
    this.IsIE=!!document.all;
   
    this.init();
    }
  }
 
  calendar.prototype.init = function (){
    var me = this;
    //On créer une div principale
    this.calendar = this.newElement({"typeElement":"div","classeCss":"calendar","parent":null});
    this.calendar.id = 'Calendrier';
    //Pour combler un bug ie , on doit ajouter les filtres d'opacité
    //Ajout du filtre
        if(this.IsIE)
        {
          this.calendar.style.filter='alpha(opacity=0)';
          this.calendar.filters[0].opacity=0;
        }
        else
        {
          this.calendar.style.opacity='0';
        }
    //Création d'une frame pour combler un bug lié aux liste sous ie
    this.bugFrame = this.newElement({"typeElement":"iframe","classeCss":"bugFrame","parent":this.calendar});
    //Création d'une divContenant le fond  pour combler un bug sous ie
    var temp = this.newElement({"typeElement":"div","classeCss":"bugFrame","parent":this.calendar});
    //Création des contenants ( mois , année , jours , listes jours etc ... )

    this.contentDay = this.newElement({"typeElement":"div","classeCss":"contentDay","parent":this.calendar});
    this.contentMonth = this.newElement({"typeElement":"div","classeCss":"contentMonth","parent":this.calendar});
    this.pMonth = this.newElement({"typeElement":"span","classeCss":"pMonth","parent":this.contentMonth});
    this.contentYear = this.newElement({"typeElement":"div","classeCss":"contentYear","parent":this.calendar});
    this.pYear = this.newElement({"typeElement":"span","classeCss":"pYear","parent":this.contentYear});
    this.contentNameDay = this.newElement({"typeElement":"ul","classeCss":"contentNameDay","parent":this.calendar});
    this.contentListDay = this.newElement({"typeElement":"div","classeCss":"contentListDay","parent":this.calendar});
   
    //Ajout des éléments dans les conteneurs ( bouton + initialisation des dates )
    this.MonthLeft = this.newElement({"typeElement":"div","classeCss":"MonthLeft","parent":this.contentMonth});
    this.MonthRight = this.newElement({"typeElement":"div","classeCss":"MonthRight","parent":this.contentMonth});
    //Ajout des évènements sur les div
    this.MonthLeft.onclick = function(){me.updateMonthBefNexCur("before");me.SlideToRight();return false};
    this.MonthRight.onclick = function(){me.updateMonthBefNexCur("next");me.SlideToLeft();return false};
   
    this.YearTop = this.newElement({"typeElement":"div","classeCss":"YearTop","parent":this.contentYear});
    this.YearBottom = this.newElement({"typeElement":"div","classeCss":"YearBottom","parent":this.contentYear});
   
    this.YearTop.onclick = function(){me.updateYearBefNexCur("next");me.SlideToTop();return false};
    this.YearBottom.onclick = function(){me.updateYearBefNexCur("before");me.SlideToBottom();return false};
   
   
    //Ajout des évènements liés au survol et appuis de la souris sur les éléments;
    this.MonthLeft.onmouseover = function(){this.className = "MonthLeftOver"};
    this.MonthLeft.onmouseout = function(){this.className = "MonthLeft"};
    this.MonthLeft.onmousedown = function(){this.className = "MonthLeftClick"};
    this.MonthLeft.onmouseup = function(){this.className = "MonthLeftOver"};
   
    this.MonthRight.onmouseover = function(){this.className = "MonthRightOver"};
    this.MonthRight.onmouseout = function(){this.className = "MonthRight"};
    this.MonthRight.onmousedown = function(){this.className = "MonthRightClick"};
    this.MonthRight.onmouseup = function(){this.className = "MonthRightOver"};
   
    this.YearTop.onmouseover = function(){this.className = "YearTopOver"};
    this.YearTop.onmouseout = function(){this.className = "YearTop"};
    this.YearTop.onmousedown = function(){this.className = "YearTopClick"};
    this.YearTop.onmouseup = function(){this.className = "YearTopOver"};
   
    this.YearBottom.onmouseover = function(){this.className = "YearBottomOver"};
    this.YearBottom.onmouseout = function(){this.className = "YearBottom"};
    this.YearBottom.onmousedown = function(){this.className = "YearBottomClick"};
    this.YearBottom.onmouseup = function(){this.className = "YearBottomOver"};
   
    //Récupération de la date du champs sinon date par défaut
   
    //Si l'élément sur lequel on a cliquez n'est pas vide on extrait la date
    if(this.element != null && this.element.value != ""){
      var reg=new RegExp("/", "g");
      var dateOfField = this.element.value;
      var dateExplode = dateOfField.split(reg);
      this.dateCurrent = this.getDateCurrent(dateExplode[0], dateExplode[1] - 1,dateExplode[2]);
    }
    else{
      this.dateCurrent = this.getDateCurrent();
    }
   
    //Récupération de la date du champs , sinon création d'une nouvelle;
    this.monthCurrent = this.dateCurrent.getMonth();
    this.yearCurrent = this.dateCurrent.getFullYear();
    this.dayCurrent = this.dateCurrent.getDate();
   
    //Création du mois courant
    this.from = this.createContentDay(0,"left");
    this.createMonth({"CurrentDay":this.dayCurrent,"CurrentMonth":this.monthCurrent,"CurrentYear":this.yearCurrent,"conteneur":this.from});
    //Création de la div qui défilera  On le remplira au moment ou on en aura besoins
    this.to = this.createContentDay(parseInt(this.calendar.offsetWidth),"left");
    this.createMonth({"CurrentDay":this.dayCurrent,"CurrentMonth":this.monthCurrent,"CurrentYear":this.yearCurrent,"conteneur":this.to});
   
    //On ajoute les éléments souhaités ( ici un tableau )  on peut utiliser la méthode AddElement pour ajouter un seul élément. on peut ajouter un id ou directement l'élément ;-)
    this.AddElements(Array(this.from,this.to));
   
    //Création de l'entete
    this.createHeader();
    this.updateDateHeader();
   
    //Positionnement du calendrier
    this.getPosition();
   
    //Apparition
    this.fadePic(0,true);
  }
 
  calendar.prototype.getDateCurrent = function (day,month,year){
     
      //Aujourd'hui si month et year ne sont pas renseignés
      if(year == null || month == null){
        return (new Date());
      }
     
      else{
        //Création d'une date en fonction de celle passée en paramètre
        return (new Date(year, month , day));
      }
  }
 
  calendar.prototype.newElement = function (parameter){
    var typeElement = parameter['typeElement'];
    var classToAffect = parameter['classeCss'];
    var parent = parameter['parent'];
   
    var newElement = document.createElement(typeElement);
    newElement.className = classToAffect;
    newElement.calendrier = true;
    if(parent == null){
      document.body.appendChild(newElement);
    }
    else{
      parent.appendChild(newElement);
    }
    return newElement;
  }

  calendar.prototype.createMonth = function(parameter){
    //Récupération des paramètres
    var CurrentDay = parameter["CurrentDay"];
    var CurrentMonth = parameter["CurrentMonth"];
    var CurrentYear = parameter["CurrentYear"];
    var conteneur = parameter["conteneur"];
   
    //On commence par détruire toute les date du conteneur :)
    /*for(var i = 0 , l = conteneur.childNodes.length; i < l;i++ ){
      conteneur.removeChild(conteneur.childNodes[i]);
    }*/
    while (conteneur.childNodes.length>0) {
      conteneur.removeChild(conteneur.firstChild);
    }
    //conteneur.innerHTML = '';
   
    //Appel de la méthode getDateCurrent retournant la date courante ou la date passé en paramètre
    var dateCurrent = this.getDateCurrent(CurrentDay,CurrentMonth,CurrentYear);
   
    //Mois actuel
    var monthCurrent = dateCurrent.getMonth()
   
    //Année actuelle
    var yearCurrent = dateCurrent.getFullYear();
   
    //Jours actuel
    var dayCurrent = dateCurrent.getDate();
   
    // On récupère le premier jour de la semaine du mois
    var dateTemp = new Date(yearCurrent, monthCurrent,1);
   
    //test pour vérifier quel jour était le premier du mois par rapport a la semaine
    this.current_day_since_start_week = (( dateTemp.getDay()== 0 ) ? 6 : dateTemp.getDay() - 1);
   
    //On initialise le nombre de jour par mois et on vérifis si l'on est au mois de février
    var nbJoursfevrier = (yearCurrent % 4) == 0 ? 29 : 28;
    //Initialisation du tableau indiquant le nombre de jours par mois
    var day_number = new Array(31,nbJoursfevrier,31,30,31,30,31,31,30,31,30,31);
   
    //On commence par ajouter les nombre de jours du mois précédent
   
    //Calcul des date en fonction du moi précédent
   
    var dayBeforeMonth = ((day_number[((monthCurrent == 0) ? 11:monthCurrent-1)]) - this.current_day_since_start_week)+1;
 
    for(i  = dayBeforeMonth ; i <= (day_number[((monthCurrent == 0) ? 11:monthCurrent-1)]) ; i ++){
     
      this.createDayInContent(i,false,false,conteneur);
    }
   
    //On remplit le calendrier avec le nombre de jour, en remplissant les premiers jours par des champs vides
    for(var nbjours = 0 ; nbjours < (day_number[monthCurrent] + this.current_day_since_start_week) ; nbjours++){
    //et enfin on ajoute les dates au calendrier
    //Pour gèrer les jours "vide" et éviter de faire une boucle on vérifit que le nombre de jours corespond bien au
    //nombre de jour du mois
      if(nbjours < day_number[monthCurrent]){
        if(dayCurrent == (nbjours+1)){
          this.createDayInContent(nbjours+1,true,true,conteneur);
        }
        else{
          this.createDayInContent(nbjours+1,false,true,conteneur);
        }
      }
    }
   
    //Calcul des date en fonction du moi suivant
    var nbCelRest = 42 - (day_number[monthCurrent]+this.current_day_since_start_week);
   
    for(i  = 0 ; i <  nbCelRest ; i ++){
     
      this.createDayInContent(i+1,false,false,conteneur);
    }

  }
 
  calendar.prototype.createDayInContent = function (dateDay,CurrentDay,active,conteneur){
    var me = this;
    //Création d'un li comprenant un noeud texte avec la date du jour
    var liDay = document.createElement("li");
    liDay.calendrier = true;
    var TextContent = document.createTextNode(dateDay);
    //Pour éviter les if else ....
    liDay.className = (CurrentDay) ? "dayCurrent":"liOut";
    liDay.className = (!active) ? "liInactive":liDay.className;
    liDay.appendChild(TextContent);
    //Ajout du survol :)
    if(active){
      liDay.onmouseover = function(){this.className = (this.className == "dayCurrent") ? this.className : "liHover";};
      liDay.onmouseout = function(){this.className = (this.className == "dayCurrent") ? this.className : "liOut";};
      liDay.onclick = function(){me.dayCurrent = this.innerHTML ; me.fillField()};
    }
    //Ajout de l'élément dans la liste
    conteneur.appendChild(liDay);
  }
 
  calendar.prototype.createContentDay = function (positionTo,position){
    //Création d'un li comprenant un noeud texte avec la date du jour
    var ulDays = document.createElement("ul");
    ulDays.calendrier = true;
    ulDays.className = "dayCal";
   
    if(position != "top"){
      if(positionTo != null){ulDays.style.left = positionTo + "px";}
      ulDays.style.top = 0 + "px";
    }
    else{
      if(positionTo != null){ulDays.style.top = positionTo + "px";}
      ulDays.style.left = 0 + "px";
    }
    this.contentListDay.appendChild(ulDays);
    return ulDays;
  }
 
  calendar.prototype.createCalendar = function (){
    //Création d'un li comprenant un noeud texte avec la date du jour
    var divContent = document.createElement("div");
    divContent.calendrier = true;
    divContent.className = "calendrier";
    document.body.appendChild(divContent);
    return divContent;
  }
 
  calendar.prototype.createHeader = function(){

    //Ajout des jours
    for(var i = 0 , l = this.dayListName.length ; i < l ; i++){
      var liDayTemp = document.createElement("li");
      liDayTemp.calendrier = true;
      TextContent = document.createTextNode(this.dayListName[i]);
      liDayTemp.appendChild(TextContent);
      //Ajout du jour dans la liste
      this.contentNameDay.appendChild(liDayTemp);
    }
  }
 
  calendar.prototype.updateDateHeader = function(){
    var me = this ;
    //On commence par détruire tous les enfants des mois et années
    while (this.pMonth.childNodes.length>0) {
      this.pMonth.removeChild(this.pMonth.firstChild);
    }
   
    while (this.pYear.childNodes.length>0) {
      this.pYear.removeChild(this.pYear.firstChild);
    }
   
    while (this.contentDay.childNodes.length>0) {
      this.contentDay.removeChild(this.contentDay.firstChild);
    }
   
    //Ajout de la date du jour
    var nomDuJour =  this.dayFullName[((this.dateCurrent.getDay()-1) == -1) ? 6 :(this.dateCurrent.getDay()-1)];
    var TextContent = document.createTextNode(nomDuJour);
    this.contentDay.appendChild(TextContent);
    var retourLigne = document.createElement("br");
    this.contentDay.appendChild(retourLigne);
    TextContent = document.createTextNode(this.dayCurrent);
    this.contentDay.appendChild(TextContent);
   
   
    //Ajout du mois
    TextContent = document.createTextNode(this.monthListName[(this.monthCurrent == 12) ? 0:this.monthCurrent]);
    this.pMonth.appendChild(TextContent);
   
    //Ajout de l'année
    TextContent = document.createTextNode(this.yearCurrent);
    this.pYear.appendChild(TextContent);
  }
 
  calendar.prototype.updateMonthBefNexCur = function(direction){
     
      if(!this.inMove){
        if(this.timer == null){
          if(direction == "next"){
            this.updateDate("next");
            this.direction = "left";
            //on le remplit
            this.createMonth({"CurrentDay":this.dayCurrent,"CurrentMonth":this.monthCurrent,"CurrentYear":this.yearCurrent,"conteneur":this.to});
          }
          else if(direction == "before"){
            this.updateDate("before");
            this.direction = "right";
            this.createMonth({"CurrentDay":this.dayCurrent,"CurrentMonth":this.monthCurrent,"CurrentYear":this.yearCurrent,"conteneur":this.to});
           
          }
        }
        //On positionne la div
        this.Positionne();
      }
  }
 
  calendar.prototype.updateYearBefNexCur = function(direction){
      if(!this.inMove){
        if(this.timer == null){
          if(direction == "next"){
            this.yearCurrent++;
            this.direction = "top";
            //on le remplit
            this.createMonth({"CurrentDay":this.dayCurrent,"CurrentMonth":this.monthCurrent,"CurrentYear":this.yearCurrent,"conteneur":this.to});
          }
          else if(direction == "before"){
            this.yearCurrent--;
            this.direction = "bottom";
            this.createMonth({"CurrentDay":this.dayCurrent,"CurrentMonth":this.monthCurrent,"CurrentYear":this.yearCurrent,"conteneur":this.to});
           
          }
        }
        //Mise a jour de la date courante :
        this.dateCurrent = new Date(this.yearCurrent, this.monthCurrent,this.dayCurrent);
        this.dateCurrent.setDate(this.dayCurrent);
        this.updateDateHeader();
        this.Positionne();
      }
  }
 
  calendar.prototype.updateDate = function(direction){
    if(this.timer == null){
      if(direction == "before"){
      //on calcul les dates suivante et précédente
        if(this.monthCurrent == 0){
          this.monthCurrent = 11;
        }
        else{
          this.monthCurrent = this.monthCurrent - 1 ;
        }
        this.yearCurrent = (this.monthCurrent == 11 ) ? this.yearCurrent - 1:this.yearCurrent;
      }
      else{
      //On récupère le mois actuel puis on vérifit que l'on est pas en janvier sinon on ajoute une année
        if(this.monthCurrent == 11){
          this.monthCurrent = 0;
     
        }
        else{
          this.monthCurrent =this.monthCurrent + 1;
        }
        this.yearCurrent = (this.monthCurrent == 0) ?  this.yearCurrent+1:this.yearCurrent;
      }
     
      //Mise a jour de la date courante :
      this.dateCurrent = new Date(this.yearCurrent, this.monthCurrent,this.dayCurrent);
      this.dateCurrent.setDate(this.dayCurrent);
      this.updateDateHeader();
    }
  }
 
  //Fonction permettant de trouver la position de l'élément ( input ) pour pouvoir positioner le calendrier
  calendar.prototype.getPosition = function() {
  var tmpLeft = this.element.offsetLeft;
  var tmpTop = this.element.offsetTop;
  var MyParent = this.element.offsetParent;
  while(MyParent) {
    tmpLeft += MyParent.offsetLeft;
    tmpTop += MyParent.offsetTop;
    MyParent = MyParent.offsetParent;
  }
    this.calendar.style.left = tmpLeft;
    this.calendar.style.top = tmpTop +  this.element.offsetHeight + 2 +"px";
  }
 
  calendar.prototype.fillField = function(){
    this.element.value = this.dayCurrent+"/"+ ((this.monthCurrent+1 == 13) ? 1:this.monthCurrent+1)+"/"+this.yearCurrent;
    //On détruit le calendrier;
    while (this.calendar.childNodes.length>0) {
      this.calendar.removeChild(this.calendar.firstChild);
    }
    document.body.removeChild(this.calendar);
    this.element.calendarActive = false;
    calendarDestruct = false;
  }
  /*##########################################################
  ############  METHODES PERMETTANT DE SCROLLER LES DATES  ##############
  ##########################################################*/
  //Permet de récupérer un élément par id
  calendar.prototype.$ = function(element){
    return document.getElementById(element);
  };
 
  //Méthode permettant de lancer les animations si en auto :)
  calendar.prototype.go = function(){
    if(this.auto){
      switch (this.direction ){
        case 'left':
          this.SlideToLeft();
        break;
        case 'right':
          this.SlideToRight();
        break;
        case 'top':
          this.SlideToTop();
        break;
        case 'bottom':
          this.SlideToBottom();
        break;
      }
    }
  }
 
  //Méthode permettant d'ajouter un élément
  calendar.prototype.AddElement = function(element){
    if(typeof(element) == "string"){
      this.elementToSlide.push(this.$(element));
    }
    else if(typeof(element) == "object"){
      this.elementToSlide.push(element);
    }
  }
 
  //Méthode permettant d'ajouter plusieurs élément d'un coup
  calendar.prototype.AddElements = function (elements){
    for(var i = 0 , l = elements.length; i < l ;i++){
      this.AddElement(elements[i]);
    }
  }
 
  //Méthode permettant de déplacer les éléments vers la gauche
  calendar.prototype.SlideToLeft = function(){
    if((this.direction == null || this.direction == 'left') && this.opacite >= 100){
      var me = this ;
      //On vérifit la direction pour initialiser le positionnement
      if(this.direction != 'left'){
          this.direction = 'left';
          if(this.timer == null){
            this.Positionne();
          }
      }
      else if(this.direction == 'left' && this.auto && this.timer == null){
        this.Positionne();
      }
     
      if(this.timer != null){
        clearTimeout(this.timer);
        this.timer = null;
      }
      //Si le timer n'est pas finit on détruit l'ancienne div
      if(parseInt(this.from.style.left) == Number.NaN || (parseInt(this.from.parentNode.offsetWidth) + parseInt(this.from.style.left))> 0){
        this.from.style.left = parseInt(this.from.style.left) - 15 + "px";
        this.to.style.left  =parseInt(this.to.style.left) - 15 + "px";
        this.inMove = true;
        this.timer = setTimeout(function(){me.SlideToLeft()},25);
       
      }
      else{
        clearTimeout(this.timer);
        this.timer = null;
        this.currentIndex = (this.currentIndex == (this.elementToSlide.length-1)) ? 0:this.currentIndex + 1;
        this.Positionne();
        this.direction = null;
        this.inMove = false;
      }
    }
  };
 
  //Méthode permettant de déplacer les éléments vers la droite
  calendar.prototype.SlideToRight = function(){
    var me = this ;
    if((this.direction == null || this.direction == 'right') && this.opacite >= 100){
        if(this.direction != 'right'){
          this.direction = 'right';
          if(this.timer == null){
            this.Positionne();
          }
        }
        else if(this.direction == 'right' && this.auto && this.timer == null){
          this.Positionne();
        }
       
        if(this.timer != null){
          clearTimeout(this.timer);
          this.timer = null;
        }
        //Si le timer n'est pas finit on détruit l'ancienne div
        if(parseInt(this.from.style.left) == Number.NaN ||  parseInt(this.from.style.left) < parseInt(this.from.parentNode.offsetWidth)){
          this.from.style.left = parseInt(this.from.style.left) + 15 + "px";
          this.to.style.left  =parseInt(this.to.style.left) + 15 + "px";
          this.inMove = true;
          this.timer = setTimeout(function(){me.SlideToRight()},25);
        }
        else{
          clearTimeout(this.timer);
          this.timer = null;
          this.currentIndex = (this.currentIndex == 0) ? this.elementToSlide.length-1:this.currentIndex - 1;
          this.Positionne();
          this.direction = null;
          this.inMove = false;
        }
    }
   

  };
 
  //Méthode permettant de déplacer les éléments vers la gauche
  calendar.prototype.SlideToTop = function(){
    var me = this ;
    if((this.direction == null || this.direction == 'top') && this.opacite >= 100){
      //On vérifit la direction pour initialiser le positionnement
      if(this.direction != 'top'){
          this.direction = 'top';
          if(this.timer == null){
            this.Positionne();
          }
      }
      if(this.timer != null){
        clearTimeout(this.timer);
        this.timer = null;
      }
      //Si le timer n'est pas finit on détruit l'ancienne div
      if(parseInt(this.from.style.top) == Number.NaN || (parseInt(this.from.style.top) > - parseInt(this.from.parentNode.offsetHeight))){
        this.from.style.top = parseInt(this.from.style.top) - 15 + "px";
        this.to.style.top  =parseInt(this.to.style.top) - 15 + "px";
        this.inMove = true;
        this.timer = setTimeout(function(){me.SlideToTop()},25);
      }
      else{
        clearTimeout(this.timer);
        this.timer = null;
        this.currentIndex = (this.currentIndex == 0) ? this.elementToSlide.length-1:this.currentIndex - 1;
        this.Positionne();         
        this.direction = null;
        this.inMove = false;
      }
    }
  };
 
  //Méthode permettant de déplacer les éléments vers le bas
  calendar.prototype.SlideToBottom = function(){
    var me = this
    if((this.direction == null || this.direction == 'bottom') && this.opacite >= 100){
      //On vérifit la direction pour initialiser le positionnement
      if(this.direction != 'bottom'){
          this.direction = 'bottom';
          if(this.timer == null){
            this.Positionne();
          }
      }
      if(this.timer != null){
        clearTimeout(this.timer);
        this.timer = null;
      }
      //Si le timer n'est pas finit on détruit l'ancienne div
      if(parseInt(this.from.style.top) == Number.NaN || parseInt(this.from.style.top) < parseInt(this.from.parentNode.offsetHeight)){
        this.from.style.top = parseInt(this.from.style.top) + 15 + "px";
        this.to.style.top  =parseInt(this.to.style.top) + 15 + "px";
        this.inMove = true;
        this.timer = setTimeout(function(){me.SlideToBottom()},25);
      }
      else{
        clearTimeout(this.timer);
        this.timer = null;
        this.currentIndex = (this.currentIndex == this.elementToSlide.length-1) ? 0:this.currentIndex + 1;
        this.Positionne();
        this.direction = null;
        this.inMove = false;
      }
    }
  };
 
  //Fonction initialisant le tableau en positionnant tous les éléments :)
  calendar.prototype.Positionne = function(){
    if(this.direction == 'left'){
      //On vérifit que l'on est pas a la fin sinon le premier devient le dernier
      if(this.currentIndex == this.elementToSlide.length-1){
        //récupération des éléments :
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[0]; //Premier élément
      }
      else{
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[this.currentIndex + 1];
      }
        this.from.style.display = "block" ;
        this.from.style.left = 0 + "px";
        this.to.style.left = this.from.parentNode.offsetWidth + "px";
        this.to.style.display = "block";
        //Posionement vertical
        this.to.style.top = 0 + "px";
        this.from.style.top = 0 + "px" ;
    }
    else if(this.direction == 'right'){
      if(this.currentIndex == 0){
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[this.elementToSlide.length-1]; // dernier élément
      }
      else{
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[this.currentIndex-1];
      }
      this.from.style.display = "block" ;
      this.from.style.left = 0 + "px";
      this.to.style.left = - (this.from.parentNode.offsetWidth )+ "px";
      this.to.style.display = "block";
      //Posionement vertical
      this.to.style.top = 0 + "px";
      this.from.style.top = 0 + "px" ;
    }
    else if(this.direction == 'bottom'){
      if(this.currentIndex == this.elementToSlide.length-1){
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[0]; // dernier élément
      }
      else{
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[this.currentIndex+1];
      }
      this.from.style.display = "block" ;
      this.from.style.top = 0 + "px";
      this.to.style.top = - (this.from.parentNode.offsetHeight )+ "px";
      this.to.style.display = "block";
      //Posionement horizontal
      this.to.style.left = 0 + "px";
      this.from.style.left = 0 + "px" ;
    }
    else if(this.direction == 'top'){
      if(this.currentIndex == 0){
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[this.elementToSlide.length-1]; // dernier élément
      }
      else{
        this.from = this.elementToSlide[this.currentIndex];
        this.to = this.elementToSlide[this.currentIndex-1];
      }
      this.from.style.display = "block" ;
      this.from.style.top = 0 + "px";
      this.to.style.top = (this.from.parentNode.offsetHeight )+ "px";
      this.to.style.display = "block";
      //Posionement horizontal
      this.to.style.left = 0 + "px";
      this.from.style.left = 0 + "px" ;
    }
  };

  calendar.prototype.fadePic = function (current,up){
    this.calendar.style.display = "block";
    this.opacite = current ;
    this.up = up ;
   
    if (this.opacite< 100 && this.up){
      this.opacite+=3;
      this.IsIE?this.calendar.filters[0].opacity=this.opacite:this.calendar.style.opacity=this.opacite/100;
      var me = this;
      this.timer = setTimeout(function(){me.fadePic(me.opacite,true)},25);
    }
    else{
      clearTimeout(this.timer);
      this.timer = null;
      this.up = false;
      calendarDestruct = true;
      calendarElement = calendarTemp;
    }
  }
  </script>
 
  <script type="text/javascript">
function foo(){
var SelHours=document.getElementById('hours');
for(i=0;i<24;i++){
var heure="0"
var OptHour=document.createElement('option');
OptHour.innerHTML=(i<10)?"0"+i:i.toString();
OptHour.value=OptHour.innerHTML;
SelHours.appendChild(OptHour);
}
 
 
var SelMins=document.getElementById('minutes');
for(i=0;i<60;i++){
var heure="0"
var OptMin=document.createElement('option');
OptMin.innerHTML=(i<10)?"0"+i:i.toString();
OptMin.value=OptMin.innerHTML;
SelMins.appendChild(OptMin);
}
 
}
 
 
 
</script>

<form method="POST" action="add.php">

<center>

<br><br><tr></br></br>

<td><input type="text" value="" onclick="var toto = new calendar(this);"></td>
<td><input type="text" name="date" size="9" value="date" maxlength="9"></td>
<td><input type="text" name="heure_depart" size="9" value="heure_depart" maxlength="9"></td>
<td><input type="text" name="heure_rentree" size="9" value="heure_rentree" maxlength="9"></td>
<td><input type="text" name="intervention" size="50" value="intervention" maxlength="50"></td>
<td><input type="text" name="adresse" size="15" value="adresse" maxlength="15"></td>
<td><input type="text" name="numero" size="4" value="numero" maxlength="4"></td>
<td><input type="text" name="ville" size="35" value="ville" maxlength="70"></td>
<td><input type="text" name="km_rentree" size="4" value="km_rentree" maxlength="4"></td>
<td><input type="text" name="nbrs_km" size="4" value="nbrs_km" maxlength="4"></td>
<td><input type="text" name="nom" size="10" value="nom" maxlength="10"></td>

</tr>

<br><br><input type="submit" value="Envoyer" name="envoyer"></br></br>

</center>
</form>
</html>

 <?php

$sql = 'SELECT * FROM interv_tbl';
 
ini_set('mysql.trace_mode', true);
 
mysql_connect('localhost', 'root', '');
mysql_select_db('cdsd');
mysql_set_charset('utf8');
 

$result = mysql_query($sql);

 
if(false !== $result)
{
    if(mysql_num_rows($result) > 0)
 
    {

        echo '<br><br><br><table border="1" align="center" width="60%" id="table1"></br></br></br>';
         
        $row = mysql_fetch_assoc($result);
         
        echo '<tr><th>', implode('</th><th>', array_keys($row)), '</th></tr>';
         
        do
        {
            echo '<tr><td>', implode('</td><td>', $row ), '</td></tr>';
        }
        while($row = mysql_fetch_row($result));
         
        echo '</table>';
    }
     
    mysql_free_result($result);    
}