insertion de plusieurs modules dans une même page

**arkarros** · 26/04/2012, 13h14

Bonjour a tous,
J'ai un petit problème dans mon projet de création de site communautaire pour une entreprise.
En fait je dois faire afficher un calendrier et un module d'information sur ma page principale
-Pour le calendrier j'ai utilisé FullCalendar, un plugin JQuery en opensource (voir ici pour la doc et le lien de téléchargement), j'ai réussi a en faire se que je voulais sur ma page et le métre en relation avec ma base de donnée.
-Pour le module d'info j'utilise le plugin tabs de JQuery (voir ici)

Le probléme est que dans ma page principale je fait afficher les deux modules dans des div différentes.

voila le header de ma page avec juste le module de calendrier :

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
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    <head>
        <title>Page principale</title>
		<link rel="stylesheet" href="style.css" /> <!--feuille de style de la page principale-->
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
 
 
 
		<link rel='stylesheet' type='text/css' href='fullcalendar-1.5.3/fullcalendar/fullcalendar.css' />
 
		<link rel='stylesheet' type='text/css' href='fullcalendar-1.5.3/fullcalendar/fullcalendar.print.css' media='print' />
		<link rel='stylesheet' type='text/css' href='fullcalendar-1.5.3/theme.css' />
 
		<script type='text/javascript' src='fullcalendar-1.5.3/js/jquery-1.7.1.min.js'></script>
		<script type='text/javascript' src='fullcalendar-1.5.3/js/jquery-ui-1.8.17.custom.min.js'></script>
		<script type='text/javascript' src='fullcalendar-1.5.3/fullcalendar/fullcalendar.js'></script>
		<script type='text/javascript' src='fullcalendar-1.5.3/fullcalendar/gcal.js'></script>
 
		<?php include("fullcalendar-1.5.3/calendrier.php"); ?>

Et la le code de la méme page avec juste le module d'info :

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
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    <head>
        <title>Page principale</title>
		<link rel="stylesheet" href="style.css" /> <!--feuille de style de la page principale-->
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><link href="jquery/css/custom-theme/jquery-ui-1.8.19.custom.css" rel="stylesheet" type="text/css"/>
 
		<script src="jquery/js/jquery-1.7.2.min.js"></script>
		<script src="jquery/js/jquery-ui-1.8.19.custom.min.js"></script>
 
		<script>
			$(document).ready(function() {
				$("#tabs").tabs();
			});
		</script>

Si je regroupe les deux il y a soit l'un soit l'autre qui ne s'affiche plus correctement.
Je pensais a faire des includes de mes modules directement dans les div, mais comment faire ? est ce que sa va marcher si dans mes fichiers a inclure je re-définis les <head> ? et est ce que sa supprimerais mon probléme ?

Je débute en javascript/jquery, j'ai peut étre loupé/oublié une partie dans le tuto du sdz ...

C'est tout bon, j ai trouvé une solution a mon probléme :
Je passe par un systeme d'<iframe> qui permet de faire afficher une page (par exemple ici une page qui affiche uniquement mon calendrier) du coup cette page a son propre CSS et js, du coup plus d'interférences

**SpaceFrog** · 26/04/2012, 16h02

iframe... pas très élégant comme solution;
tu aurais pu passer par un load() ...

insertion de plusieurs modules dans une même page

jQuery

Discussions similaires

Partager

Partager