include in div-tag

B

Barry007

Grünschnabel
Hallo, ich hab kein Plan von PHP,
möchte aber in einen Div-Tag (id="main") andere Seiten/Inhalte über das Menü einfügen.

Der Quelltext der index.html bzw. später dann index.php:

PHP: 
<!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" />
<title>Unbenanntes Dokument</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="container">
<div id="banner"></div>
<div id="menu">
<ul id="MenuBar1" class="MenuBarHorizontal">
  <li><a href="#">Home</a></li>
  <li><a href="#">News</a></li>
  <li><a class="MenuBarItemSubmenu" href="#">FNX-Crew</a>
  	  <ul>
        <li><a href="#">Kamufaash</a></li>
        <li><a href="#">Stivio</a></li>
        <li><a href="#">Skeptix</a></li>
        <li><a href="#">Sunday</a></li>
        <li><a href="#">Tonemann</a></li>
        <li><a href="#">Dave</a></li>
        <li><a href="#">Barry</a></li>
      </ul>
  </li>
  <li><a href="#">Sampler</a></li>
  <li><a href="#">Alben</a></li>
  <li><a href="#">Arts</a></li>
  <li><a class="MenuBarItemSubmenu" href="#">Download</a>
      <ul>
      	<li><a href="#">Exclusivs</a></li>
        <li><a href="#">Wallpaper</a></li>
        <li><a href="#">Fotos</a></li>
        <li><a href="#">Sonstiges</a></li>
      </ul>
  </li>
  <li><a href="#">Shop</a></li>
  <li><a href="#">Kontakt</a></li>
  <li><a href="#">Impressum</a></li>
</ul>
</div>
<div id="newsticker">News-Ticker Banner</div>
<div id="Accordion1" class="Accordion" tabindex="0">
  <div class="AccordionPanel">
    <div class="AccordionPanelTab">Bezeichnung 1</div>
    <div class="AccordionPanelContent">Inhalt 1</div>
  </div>
  <div class="AccordionPanel">
    <div class="AccordionPanelTab">Bezeichnung 2</div>
    <div class="AccordionPanelContent">Inhalt 2</div>
  </div>
  <div class="AccordionPanel">
    <div class="AccordionPanelTab">Bezeichnung 3</div>
    <div class="AccordionPanelContent">Inhalt 3</div>
  </div>
  <div class="AccordionPanel">
    <div class="AccordionPanelTab">Bezeichnung 4</div>
    <div class="AccordionPanelContent">Inhalt 4</div>
  </div>
  <div class="AccordionPanel">
    <div class="AccordionPanelTab">Bezeichnung 5</div>
    <div class="AccordionPanelContent">Inhalt 5</div>
  </div>
</div>
<div id="guestbook">Gästebuch-Link</div>
<div id="main">Inhalt aufrufbar über Menü</div>
<div id="release">Release Info</div>
<div id="mp3player">Mp3-Player</div>
<div id="advertising">Werbung / Video</div>
<div id="footer"></div>
</div>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
//-->
</script>
</body>
</html>

Was muss ich machen damit sich nur im Main-Div die Inhalte ändern wenn ich im Menü auf einen link klicke?

Danke schon im vorraus
 
Wenn du rein PhP html scriptest wird die Seite so oder so komplett nachgeladen.
Aber wenn du trotzdem mit nur einer datei arbeiten will benutzt du einfach eine Hilfsdatei.

HTML: 
 ### inhalt.php ###
$section = trim($_GET['section']);
$sections = array('section1', 'section2', .....);

if(in_array($section, $sections)) {
	if(file_exists('inc/'.$section.'.php')) {
		include 'inc/'.$section.'.inc.php';
	} else {
		include 'inc/savesection.inc.php';
	}
} else {
	include 'inc/savesection.inc.php';
}
Dies ist eine hilfsdatei an die du verweist. Die wird in dem Anzeige Div included. (in der index.php)

<div><?php include "inhalt.php"; ?></div>



Deine Links sollten dann folgendesmasen aussehen.
<a href="index.php?section=section1">Link</a>


So verweist du mit deinen Links immer auf die Index.php mit der gesetzten Section. Die Inhalt.php in der Index.php entscheidet dann welcher Content included werden soll. Sollte dann jemand andere GET Variablen in die Adressleiste einfügen wird über "in_array" und "file_exists" eine default seite ausgegeben.

In das Array $sections in der Inhalt.php trägst du dann deine einzelnen Sectionen ein. Der einzigste Hacken an dem ganzen ist das deine include Dateien genau so heißen müssen wie die section oder so baust noch eine switch case anweisung ein und andere Dateinamen verwenden zu können.

Aber wie du die GET-variablen überprüfst leigt ganz bei dir, meine Beispiel ist hier nicht das sicherste.
 
Also wie gesagt, ich hab kein Plan von PHP.
Wie muss ich des angeben damit ich von dem Menü <div id="menu"> aus den Inhalt im <div id="main"> verändern kann? Sprich externe phpfiles mit nem HTML-Inhalt (Text und Bilder) einfügen in den div (wie bei nem iframe).
 
Ich muss auf AJAX zurückgreifen, in wie fern?
Ich kann nur ein paar wenige Grundlagen von PHP und JavaScript, kann man mir das jemand etwas genauer erklären was ich da machen muss damit ich die Denkschritte nachvollziehen kann wie ich an den Punkt komme um das zu erreichen was ich will?

Muss ich was im HTML-Gerüst verändern?
Muss ich die Verlinkung anders machen?
Was muss ich mit AJAX machen damit die Seite statisch bleibt und nicht nachläd?

Danke für jede Antwort ! Auch für die vorherigen !!
 
Wenn du nach oben genannten Methoden einen Link anklicken würdest, würde die gesamte Seite neu geladen, also sozusagen von <html><head><...> bis </html>, jedoch der tatsächliche Inhalt innerhalb deines <div> zur Darstellung des Inhalts, der wäre je nach Auswahl verschieden.
Mit Ajax würdest du per Javascript einen Teil der Seite neu laden, z.B. dein Inhalts-div. Es wird also nicht die ganze Seite neu aufgerufen, sondern nur per Javascript der Teil ersetzt, den du möchtest. Das PHP-Script, das von dem Ajax-Javascript aufgerufen wird, darf somit nur den für den Inhalt benötigten HTML-Code zurückgeben, also nur das, was nachher tatsächlich in deinem div landen soll - kein <html><head>... und dergleichen
http://de.wikipedia.org/wiki/Ajax_(Programmierung)
MfG
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück