PHP Include durch AJAX Code ersetzen?

Carrear

Carrear

Erfahrenes Mitglied
Hi Leute,

ich benutze auf einer Webseite,welche ich für ein paar Hobbymusiker programmiere ganz einfaches php include. D.h. ich hab ne hauptseit. die kann man (vereinfacht) in navi und content unterteilen.

In der navi habe ich nur links mit "index.php?site=xxx" - das xxx ist dann stellvertretend für eine datei. Gebe ich dort z.B. home ein wird die datei ./inc/home.inc.php im content Bereich eingebunden, gebe ich crew ein wird die datei ./inc/crew.inc.php im content bereich eingebunden.

In den .inc.php Dateien hab ich dann nur das PHP und HTML dass im Content Bereich genutzt wird drin, denn der <head> Bereich und so weiter ist ja schon alles in der index.php definiert. Dieses Include findet immer in einem bestimmten <div> Tag in der index,php statt.

Ich würde das ganze jetzt gerne aus praktischen Gründen ersetzen. Anstatt dem PHP Include würde ich das gerne mit AJAX lösen. Ich habe gehört, dass dann kein Refresh nötig ist. Es wäre klasse, wenn ich dafür nur die Links und den Content <div> tag anpassen müsste. ISt das so ohne weiteres möglich?

LG
Fatih
 
Moin Fatih,

jo, sowas ist ohne weiteres möglich und unter Nutzung eines Frameworks in wenigen Augenblicken getan :)

Hier mal ein jQuery-Beispiel:
Code: 
<a href="index.php?site=home" onclick="$('#content').load('inc/home.inc.php');return false;">
  Home
</a>
<div id="content"><?php /* php-Code zum includen */?></div>

Ich würde deine bisherige Variante aber nicht ersetzen, sondern erweitern...sonst bekommen Leute mit deaktiviertem JS nichts zu Sehen.
 
Okay, von Frameworks hab ich schon gehört :D

Das sind doch sowas wie vorgefertigte Funktionen oder? Welches Framework müsste ich da einbinden (macht man doch so oder :D ?) um diese Art von Link nutzen zu können? Oder geht das so ohne weiteres?

Wenn ich das richtig verstehe ist das da hinter der Raute die ID des <div> Tags in dem dann der Inhalt der Datei geladen wird welche in deinem Beispiel in Klammern steht? Und der kann auch mit PHP Dateien umehen? Habe mal gelesen, dass der irgendwie PHP dann nicht mehr parsen kann.

Danke für deine schnelle und unkomplizierte Hilfe.

LG Fatih

EDIT: Ich sehe gerade das jQuery an sich so ein Framework ist, richtig? Sorry für diese Frage falls das stimmt :D Sehe dann allerdings noch ein kleines Problem. Manchmal sind die Include-Dateien die ich aufrufe abhängig von $_GET Variabeln, die ich ja über den Link weitergebe. Da ich kein Refresh habe wird sich ja auch der Link dann nicht mehr ändern. Welche Möglichkeit hat man denn da um die entsprechenden $_GET Werte doch noch mit zu übergeben (Für Datenbankabfragen).
 
Zuletzt bearbeitet:
Hi,

möglich ist das durchaus, wobei ich persönlich finde, dass das kein besonders sinnvoller Einsatz von Ajax ist. Was spricht denn dagegen, die Seite komplett neu zu laden? Logisch gesehen ruft man ja eine neue Seite auf.

Wenn Du das trotzdem so machen willst, würde ich zumindest sicherstellen, dass die Seite auch ohne Javascript noch funktioniert. Das könnte z.B. so aussehen, dass Du den Navigationslinks onload jeweils einen onclick-Handler verpasst, der sich den site-Parameter aus der URL pult, per Ajax das Content-Div aktualisiert und false zurückgibt, damit der Browser nicht die URL im href-Attribut anfordert.

Eine ganz gute Einführung zum Thema Ajax findest Du im Kapitel 18 des openBooks "Javascript und Ajax" auf Galileo Computing.

Wenn Du noch weitere Javascript-Anwendungen wie z.B. Bildergalerien in einer Lightbox oder ähnliches verwenden möchtest, würde es sich auch lohnen, sich mal ein Framework wie JQuery anzuschauen. Damit kannst Du das ziemlich kurz und schmerzlos realisieren.

LG

Edit// Ups, das war jetzt sehr langsam... :-(
 
kuddeldaddeldu hat gesagt.:
Das könnte z.B. so aussehen, dass Du den Navigationslinks onload jeweils einen onclick-Handler verpasst, der sich den site-Parameter aus der URL pult, per Ajax das Content-Div aktualisiert und false zurückgibt, damit der Browser nicht die URL im href-Attribut anfordert.
Zum Vergrößern anklicken....

Danke für die Antwort. Ich habe mich soeben schonmal ein bisschen schlau gemacht um überhaupt mal zu verstehen, was da so ungefähr passiert. Ich finde diese Einleitung zu jQuery gut gelungen und für mich verständlich: http://www.ajaxschmiede.de/jquery/jquery-ein-machtiges-und-effizientes-werkzeug/

Da ich ja die Seite ohnehin schon so gut wie fertig habe ist es kein Problem (sobald ich es verstanden habe) die Sache so laufen zu lassen, dass auch JS averse Nutzer die Seite noch gut benutzen können. Gründe hat das folgende. Bestimmte Sachen wie z.B. die Hintergrundmusik oder laufende Videos werden durch ein Reload im Prinzip nur gestört. Diese laufen außerhalb des Content Bereiches.
Außerdem ist der Betreiber der Seite wie gesagt eine Privatperson. Das ständige laden von Musik und Videos verbraucht ohnehin schon sehr viel Traffic. Da will ich versuchen an anderen Stellen zu sparen, auch wenn das am Ende nur der Tropfen auf dem heißen Stein ist.

Außerdem ist es ja vielleicht auch mal interessant für zukünftige Vorhaben. Da kann es mir nur recht sein ,dass ich mich jetzt "schon" damit beschäftige :)

Den oben zitierten Satz habe ich noch nicht verstanden. Aber ich denke wenn ich mir die Begriffe mal ansehe werd ichs schon peilen. Was sich jetzt für mich noch nicht geklärt hat sind die Fragen die ich oben in meinem EDIT gestellt habe. Also was ist mit den $_GET Variabeln und wie sieht es mit dem Parsen von PHP aus?

LG
Fatih
 
Was das Parsen betrifft:
Das Dokument(bspw. home.inc.php) , welches dort angefordert wird, kommt schon geparst an, es enthält also keinen PHP-Code mehr.
Es wird genau das ausgeliefert, was du auch bekommen würdest, wenn du die home.inc.php direkt im Browser aufrufst.

Die $_GET-Variablen kannst du am besten per PHP für Javascript bereitstellen:


Code: 
<script type="text/javascript">
var GET=<?php echo json_encode($_GET);?>;
</script>
Du hast da jetzt in JS eine Variable namens GET, welche den Inhalt des PHP-$_GET beinhaltet(allerdings als Objekt und nicht als Array)

Diese JS-Variable kannst du direkt beim Aufruf von load() in der URL verwenden:

Code: 
<a href="index.php?site=home" onclick="$('#content').load('inc/home.inc.php?'+jQuery.param(GET));return false;">

Und die home.inc.php kann diese GET-Variable mit der Antwort auch ändern, bspw:
Code: 
<pre>
<strong>sichtbarer HTML-Code:</strong>

<?php
print_r($_GET);
?>
</strong>
</pre>


<script type="text/javascript">
GET=<?php echo json_encode(array('andereVariable'=>'andererWert'));?>;
</script>

Bei der nächsten Betätigung wird derselbe Link die neu gesetzte GET-Variable übergeben :)
 
Sven Mintel hat gesagt.:
Bei der nächsten Betätigung wird derselbe Link die neu gesetzte GET-Variable übergeben :)
Zum Vergrößern anklicken....

Das ist ja echt interessant. Das heißt in deinem Beispiel oben wird der GET Parameter dann direkt aus dem Link genommen, den ich vorne im Tag eingebe und nicht aus der Adressleiste? Bei mir läuft Programmierung immernoch visuell ab - wenn ich GET Parameter nutze, dann ist das für mich das Ding da oben in der Adresszeile, davon muss ich mich jetzt wohl verabschieden :D

Okay, und die Möglichkeit mit der Veränderung des GET Parameters ist ja wirklich interessant. Hört sich an, als ob man das mal nutzen könnte, ich weiß zwar noch nicht wofür, aber da fällt mir sicher was ein :D

Und die neue Festsetzung des Parameters würde ich dann am Ende der Includeten Datei einsetzen oder?

Danke, für diese Antworten an dieser Stelle. Ihr habt innerhalb einer halben Stunde eine Menge Licht ins Dunkel gebracht.

LG
Fatih

EDIT:

Wo müsste ich denn das hier hinsetzen?

Code: 
<script type="text/javascript">
var GET=<?php echo json_encode($_GET,false);?>;
</script>
 
Carrear hat gesagt.:
Das ist ja echt interessant. Das heißt in deinem Beispiel oben wird der GET Parameter dann direkt aus dem Link genommen, den ich vorne im Tag eingebe und nicht aus der Adressleiste? Bei mir läuft Programmierung immernoch visuell ab - wenn ich GET Parameter nutze, dann ist das für mich das Ding da oben in der Adresszeile, davon muss ich mich jetzt wohl verabschieden :D
Zum Vergrößern anklicken....

Ja, für Javascript existiert $_GET nicht als Variable, für Javascript ist die URL in der Adresszeile des Browsers nur eine lange Zeichenkette, mehr nicht.

Du kannst diese JS-Variable GET dort also nach gutdünken füllen, entweder per PHP mit dem "echten" $_GET, oder mit irgendetwas anderem(allerdings in Form eines Objektes, sonst kann JQuery.param() nicht damit umgehen ).

Es ist halt deine Variable und keine vom User gesetzte Variable wie in PHP.
 
Carrear hat gesagt.:
EDIT:

Wo müsste ich denn das hier hinsetzen?

Code: 
<script type="text/javascript">
var GET=<?php echo json_encode($_GET,false);?>;
</script>
Zum Vergrößern anklicken....


Das musst/kannst du überall dort hinsetzen, wo du willst, dass diese JS-Variable verfügbar gemacht wird...es ist eigentlich egal, wo in der Seite du es hinschreibst, solange es dort steht, wo ein <script> -Element zugelassen ist.
 
Sven Mintel hat gesagt.:
Das musst/kannst du überall dort hinsetzen, wo du willst, dass diese JS-Variable verfügbar gemacht wird...es ist eigentlich egal, wo in der Seite du es hinschreibst, solange es dort steht, wo ein <script> -Element zugelassen ist.
Zum Vergrößern anklicken....

Okay, also nur mal angenommen man ordnet es so an:

Code: 
<script type="text/javascript">
var GET=<?php echo json_encode($_GET,false);?>;
</script>
<a href="index.php?site=home" onclick="$('#content').load('inc/home.inc.php?'+jQuery.param(GET));return false;">

Wie kann denn da oben schon der $_GET Parameter in GET eingelesen werden, wenn der Link erst danach komm. Oder interpretiere ich das richtig, wenn ich sage, dass der obere Teil so eine Art Funktion ist, die immer dann wenn ich den Ausdruck GET nutze das $_GET ausliest? Dementsprechende reicht es ja, wenn ich den oberen Teil ein einziges mal in eine JS Datei auslagere und diese im <head> Bereich einbinde, oder?

LG
Fatih
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück