Script non pris en compte.

**Ttom89** · 04/04/2012, 14h46

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.

**Bovino** · 04/04/2012, 15h03

La première chose, c'est que tu ne peux pas avoir une page HTML complète (c'est-à-dire avec doctype, head et body) dans une autre page HTML !
Ta structure est mauvaise, il faut la revoir.

**Ttom89** · 04/04/2012, 15h15

Oui je suis bien d'accord, mais dans ce cas, mes scripts de ma deuxième page, je les mets ou?
Merci.

**Darkyl** · 05/04/2012, 16h29

Salut,

Bovino signifie juste que ta structure est mauvaise. Tu ne peux avoir deux pages html l'une dans l'autre, sauf dans le cas des frames, donc soit tu passes par une frame, soit tu copie / colle tout ce qui n'est pas dans le body de la 2cde, dans le head de la première (à moins que je ne m'abuse).

Ton script ne marche pas car tu dois avoir une erreur lors de l'affichage de la 2cde page dans la première.

Le head n'est pas "exécuté" et les fonctions sont alors inconnues pour la suite des évènements.

Sinon, une solution pour exécuter tes scripts ( Bovino me dira si ç'est une bonne idée

):

Code :

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

1
2
3
4
5
6
7
8
9
10
 
var AllScripts=document.getElementById('titreOnglet').getElementsByTagName("script");
 
		for (var i=0; i<AllScripts.length; i++) 
		{
			var s=AllScripts[i];
 
			window.eval(s.innerHTML);
 
		}

A mettre dans la fonction changer(titre), une fois la page chargée complètement.

**Ttom89** · 06/04/2012, 11h12

Salut,

désolé pour la réponse tardive, mais merci bien de t'intéresser à mon problème je vais essayer cela quand je serais au boulot (car c'est un projet de stage, donc je n'ai pas le code chez moi) et je vous tiens au courant.

Merci encore.

Script non pris en compte.

JavaScript

Discussions similaires

Partager

Partager