Onglet généré en php et requete ajax

Soyez le premier à donner votre avis sur cette source.

Vue 21 502 fois - Téléchargée 2 191 fois

Description

script qui génère des onglets,le contenu et les titres des onglets sont géré par MySQL,le script AJAX fait une requete sur une page PHP qui va chercher les donnée sur la BDD.

j'ai commenter la source en espérant que sa puisse aider :)

Source / Exemple :


<?php
include('./connection/connection.php');//inclu les paramètres de connection à la base de donnée
    if (!$connect)//si pas connecter a la base de donnée déclenche une érreur SQL
       die("Erreur de connection à MySQL: " . mysql_error());	   
if (!mysql_select_db($database_connect, $connect))//si base non trouvée déclenche une erreur SQL
       die("Erreur base de donnée non trouvée: " . mysql_error());
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="./onglet.css" rel="stylesheet" type="text/css" />
<?php
echo "<script type=\"text/javascript\">\n";//génération du des paramètre pour le javascript qui seron utilisé par le script AJAX
echo "<!--\n";
$requete='SELECT * FROM multionglet';//sélectionne la table pour la gestion du contenu
$requeteongletjs= mysql_query($requete, $connect) or die("Erreur table non trouvée:".mysql_error());//déclenche une erreur si la table n'est pas trouvé
$ongletjs = mysql_fetch_object($requeteongletjs);//sélectionne le premier enregistrement de la table
$tabonglet=array(0 => array("onglet"=>$ongletjs->onglet,"titre"=>$ongletjs->titre,"contenu"=>$ongletjs->contenu));//stock dans un tableau a 2 dimension les donnée de la table
$compteur=1;//variable qui stock le nombre d'onglet a afficher
$valeur="'".$ongletjs->onglet."'";//stock dans la variable l'ID des onglets
while ($ongletjs = mysql_fetch_object($requeteongletjs))//requete pour lister toute la table
{
	$valeur=$valeur.",'".$ongletjs->onglet."'";
	$tabonglet[]=array("onglet"=>$ongletjs->onglet,"titre"=>$ongletjs->titre,"contenu"=>$ongletjs->contenu);
	$compteur++;
}
echo"compteur=".$compteur.";\n";//variable transformer en javascript pour utilisation avec le script AJAX pour avoir le nombre d'onglet
echo "tabu=[".$valeur."];\n";//variable qui va stocker toute les ID transmit pour le script AJAX
echo "//-->\n";
echo "</script>\n";
?>
<script type="text/javascript" src="onglet.js"></script>
<title>onglet</title>
</head>
<body>
<table border="0" width="400" align="center">
  <tr>
  	<td>
<?php

echo "		<ol id=\"tabnav\">\n";
echo "			<li><a href=\"javascript:onglet('".$tabonglet[0]["onglet"]."');\" class=\"active\" id=\"".$tabonglet[0]["onglet"]."\">".$tabonglet[0]["titre"]."</a></li>\n";//génère l'onglet actif
$i=1;
	while ($i<$compteur) 
		{
					echo "			<li><a href=\"javascript:onglet('".$tabonglet[$i]["onglet"]."');\" id=\"".$tabonglet[$i]["onglet"]."\">".$tabonglet[$i]["titre"]."</a></li>\n";//génère les autres onglets
					$i++;
		}
echo "		</ol>\n";
echo "		<div id=\"contenu\" class=\"tabtour\"><br/>".$tabonglet[0]["contenu"]."<br/><br/></div>\n";//génère le div qui va contenir les données de l'onglet
?>
	</td>
  </tr>
</table>
</body>
</html>
<?php
mysql_close($connect);//fermeture de la connection SQL
?>

Conclusion :


tous est dans le zip,tester sous IE7,firefox 2 et 3,safari sans aucun problème

PS:j'ai vue que sur l'onglet actif en bas a gauche il manque 1 pixel pour je ne c'est trop quel raison je vais essayer de trouver la solution

Codes Sources

A voir également

Ajouter un commentaire Commentaires
jordane45
Messages postés
36069
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
17 août 2022
351
13 déc. 2017 à 08:23
Qui plus est.. qui date un peu.
Ca utilise l'extension mydql_* qui est obsolète.
A la limite en transformant le code en PDO ou mysqli_* ça peut aller.
Whismeril
Messages postés
17682
Date d'inscription
mardi 11 mars 2003
Statut
Modérateur
Dernière intervention
16 août 2022
613
13 déc. 2017 à 08:11
Heu non, c’est du php, pas du html....
beljane
Messages postés
1
Date d'inscription
mercredi 13 décembre 2017
Statut
Membre
Dernière intervention
13 décembre 2017

13 déc. 2017 à 01:03
voila une application pour débuter en programmation html
m8x
Messages postés
1
Date d'inscription
samedi 16 juin 2007
Statut
Membre
Dernière intervention
6 août 2015

6 août 2015 à 14:03
Salut djmmix et merci pour ce projet.
Sous EasyPHP 12.1, j'ai était confronté à une erreur :
requete.php ligne 7 & 9, j'ai remplacé $HTTP_GET_VARS par $_GET.
Si j'ai bien compris, $HTTP_GET_VARS est déprécié.
Cordialement
cs_arauch
Messages postés
2
Date d'inscription
lundi 23 décembre 2002
Statut
Membre
Dernière intervention
13 septembre 2009

13 sept. 2009 à 12:39
Bonjour,
votre source est parfait. je suis débutant, je parviens a inclure du html mais puis-je inclure dans un onglet une liste ecrite en php ? j'ai essayé mais le php n'est pas interprété. Quelqu'un peut-il me renseigner ? merci d'avance.alain
Afficher les 17 commentaires

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.