Bonjour à tous,

je suis actuellement sur un projet de développement d'une application en php et javascript.

Je vous explique brièvement ce dernier:
Il s'agit de la gestion de prise de rendez-vous.
Donc il me faut sur la page principale, un système d'onglet pour avoir une visualisation complète de l'application au premier coup d’œil (question de goût ).
Jusque ce point ça peut aller, j'utilise du javascript, un script trouver sur le net pour la mise en page.

Dans ces onglets, je dois entre autre, faire apparaître un tableau récapitulatif des rendez-vous. Ce dernier se fait avec un script javascript trouver sur le net.
Cependant, comme je fais un include dans l'index, les scripts de mon autre page ne sont pas prise en compte.

Je crois que je vous perds là

Pour être plus clair, j'ai deux fichiers, un index (ou sont mes onglets) et une page, gestionRDV.php, ou j'affiche mon tableau.
Je dois donc afficher ce tableau dans mon première onglet.

index.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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
     <title>Gestionnaire de rendez-vous</title>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
     <!-- style pour les onglets -->
     <link href="css/styleTab.css" rel="stylesheet" type="text/css" />
 
     <!-- script pour les onglets -->
     <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
     <script type="text/javascript" src="js/jquery-ui-1.8.14.custom.min.js"></script>
 
     <!-- Fonction pour la gestion des onglets -->
     <script type="text/javascript">
	$(document).ready(function() {
            $("#tabs").tabs();
        });
     </script>
 
     <!-- fonction pour changer le titre en fonction de l'onglet -->
     <script type="text/javascript">
        function changer(titre) {
            document.getElementById('titreOnglet').innerHTML = titre;
        }
     </script>
 
     <style type="text/css">
        /*demo page css*/
        body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
        ul#icons {margin: 0; padding: 0;}
        ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
        ul#icons span.ui-icon {float: left; margin: 0 4px;}
    </style>
</head>
<body>
    <h1>Cabinet du Maire</h1>
    <h2 id="titreOnglet">Gestion des demandes de rendez-vous</h2>
    <div id="tabs">
        <ul>
                <li><a href="#tabs-1" onClick="changer('Gestion des demandes de rendez-vous');">Rendez-vous</a></li>
                <li><a href="#tabs-2" onClick="changer('Statistique des demandes de rendez-vous');">Statistiques</a></li>
                <li><a href="#tabs-3" onClick="changer('Administration des rendez-vous');">Administration</a></li>
        </ul>
        <div id="tabs-1"><?php include('gestionrdv.php');?></div>
        <div id="tabs-2"><?php include('statistiques.php');?></div>
        <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
    </div>
</body>
</html>
gestionrdv.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
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
159
160
161
162
163
164
165
166
167
168
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<?php
  require_once ('include/commun.inc.php');
?>
  <head>
    <title>Gestion des demandes de rendez-vous</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <style type="text/css" title="currentStyle">
      @import "media/css/table_page.css";      
      @import "media/css/table_jui.css";
      @import "examples_support/themes/smoothness/jquery-ui-1.8.4.custom.css";
    </style>
	<link rel="stylesheet" href="themes/base/jquery.ui.all.css">
	<link rel="stylesheet" href="css/dialog_page.css">
	<style>
		input.text { margin-bottom:12px; width:95%; padding: .4em; }
		fieldset { padding:0; border:0; margin-top:15px; }
		.ui-dialog .ui-state-error { padding: .3em; }
		.validateTips { border: 1px solid transparent; padding: 0.3em; }
	</style>
 
    <script src="ajax/libs/jquery/1.5/jquery-1.5.1.js"></script>
    <script type="text/javascript" language="javascript" src="media/js/jquery.js"></script>
    <script type="text/javascript" language="javascript" src="media/js/jquery.dataTables.js"></script>
 
    <script type="text/javascript" charset="utf-8">
      $(document).ready(function() {
				/* Add a click handler to the rows - this could be used as a callback */
				$("#mytable tbody").click(function(event) {
					$(oTable.fnSettings().aoData).each(function (){
						$(this.nTr).removeClass('row_selected');
					});
					$(event.target.parentNode).addClass('row_selected');
 
					var anSelected = fnGetSelected( oTable );
                                        var iRow = oTable.fnGetPosition( anSelected[0] );
                                        var data = oTable.fnGetData( iRow );
                                        var Id = data[0];
 
                                        //alert (iRow + ' - ' + Id);
				});
 
				/* Add a click handler for the delete row 
				$('#delete').click( function() {
					var anSelected = fnGetSelected( oTable );
					oTable.fnDeleteRow( anSelected[0] );
				} );*/
 
				/* Init the table */
                                     oTable = $('#mytable').dataTable({
                                              "bJQueryUI": true,
                                              "sPaginationType": "full_numbers",
					"oLanguage": {
						"sUrl": "examples_support/fr_FR.txt"
					}
                                     });
                                   });
 
			/* Get the rows which are currently selected */
			function fnGetSelected( oTableLocal )
			{
				var aReturn = new Array();
				var aTrs = oTableLocal.fnGetNodes();
 
				for ( var i=0 ; i<aTrs.length ; i++ )
				{
					if ( $(aTrs[i]).hasClass('row_selected') )
					{
						aReturn.push( aTrs[i] );
					}
				}
				return aReturn;
			}
 
			function fnShowHide( iCol )
			{
				/* Get the DataTables object again - this is not a recreation, just a get of the object */
				var oTable = $('#mytable').dataTable();
 
				var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
				oTable.fnSetColumnVis( iCol, bVis ? false : true );
			}
 
			function fnHideColumn()
			{
				for ( var i=6 ; i<14 ; i++ )
				{
					fnShowHide( i );
				}
			}
    </script>
  </head>
 
  <body id="dt_page" style="font-size:62.5%;" onload="fnHideColumn();">
    <div id="container">
      <div class="table">
          <button id="create-rdv">Ajouter un rendez-vous</button>
          <button id="update-rdv">Modifier un rendez-vous</button>
      </div>	  
      <div class="table_jui">
        <table cellpadding="0" cellspacing="0" border="0" class="display" id="mytable">
          <thead>
            <tr>
              <th rowspan="2">Id</th>
              <th rowspan="2">Date</th>
              <th colspan="3">Demandeur</th>
              <th rowspan="2">Objet</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
              <th rowspan="2">.</th>
            </tr>
            <tr>
              <th>Civ.</th>
              <th>Nom</th>
              <th>Pr&eacute;nom</th>
            </tr>
          </thead>
          <tbody onActivate="fnHideColumn();">
            <?php
                $tab_query = array();
                $tab_query = $db->get_results("SELECT a.id_demande, a.date, a.id_destinataire, b.civilite, b.nom, b.prenom, 
                                                b.adresse, b.cp, b.ville, b.tel, b.mail, a.id_categorie, a.libelle
                                                FROM demande a, demandeur b
                                                WHERE a.id_demandeur = b.id_demandeur
                                                ORDER by a.id_demande DESC");
 
                foreach($tab_query as $tq) {
                    $ligne="";
                    $objet = substr(stripslashes(html_entity_decode($tq->libelle)),0,50)."...";
                    $ligne.="<tr class=\"gradeC\">";
 
                    $ligne.="<td class=\"center\" id=\".$tq->id_demande.\">".$tq->id_demande."</td>";
                    $date=explode('-', $tq->date);
                    $dateformat=$date[2].'/'.$date[1].'/'.$date[0];
                    $ligne.="<td class=\"center\">".$dateformat."</td>";
                    $nom=html_entity_decode($tq->nom);
                    $prenom=html_entity_decode($tq->prenom);
                    $ligne.="<td>".$tq->civilite."</td>";
                    $ligne.="<td>".$nom."</td>";
                    $ligne.="<td>".$prenom."</td>";
                    $ligne.="<td>".$objet."</td>";
                    $ligne.="<td>".$tq->id_destinataire."</td>";
                    $ligne.="<td>".$tq->adresse."</td>";
                    $ligne.="<td>".$tq->cp."</td>";
                    $ligne.="<td>".$tq->ville."</td>";
                    $ligne.="<td>".$tq->tel."</td>";
                    $ligne.="<td>".$tq->mail."</td>";
                    $ligne.="<td>".$tq->id_categorie."</td>";
                    $ligne.="<td>".stripslashes(html_entity_decode($tq->libelle))."</td>";
 
                    $ligne.="</tr>";
 
                    echo $ligne;
                }
            ?>
        </tbody>
      </table>
    </div>
    </div>
 
    </body>
</html>
ce dernier code fonctionne nikel quand on le lance tout seul, mais une fois intégrer dans l'onglet, ca pète tout.

Voila, j'espère que vous m'avez compris et que vous pourrez me venir en aide.

PS: je suis débutant.