Druckbare Version
Sicherlich kennt ihr das AJAX Klickaddon von Gremlin...nun wollte ich euch mal fragen ob es eine einfache möglichkeit gibt das ganze für die komplette Seite zu nutzen?
Also so das nicht die komplette Seite immer neu geladen wird sondern nur der content.
dazu gebe es einfachere möglichkleiten wie:
http://www.dynamicdrive.com/dynamici...jaxcontent.htm
oder
http://www.plehn-media.de/showroom/a...nt-slider.html
Man müsste, abgesehen vom Javascript Code, auch an den PHP Dateien was ändern, da diese ja (bps.w die content/intern/mediadaten.php) nicht "direkt" aufgerufen werden können.
Und komplett, also via ?content=/intern/medidaten hätte man ja nix gespart, da ja doch wieder "alles" berechnet und ausgegeben würde.
Evtl eine ajax.php in das Hauptverzeichnis, die dann beim Aufruf von ajax.php?content=/intern/mediadaten die header.php und menues und footer etc weglässt, und nur functions.lib/layout.lib (für head()/foot() ) einbindet, und natürlich die entsprechende "Content" Datei.
Ganz grob gesagt, in der header.php und footer.php um den "Inhalt" ein <div> rum
, müssen nur noch alle Links umgeschreiben werden, dass diese eben den Javasript Aufruf machen.
Wäre aber so keine schöne Lösung, bspw.fehlt dann noch Feedback für den User (Ladeanimation, wenns mal wiederlänger dauert), es muss quasi jeder Link manuell angepasst werden, funzt dann auch nur bei Usern mit Javascript aktiviert usw.
Evtl. ist da sowas wie jQuery hilfreich, damit ist es auch möglich, ohne die Links zu ändern, Regeln zu definieren, und das JS fügt den Links nachträglich die AJAX Funktionalität hinzu, jemand der JS deaktiviert hat, bei dem bleibt halt alles wie gehabt.
Auch Animationen, bspw. dass sich der "alte" Inhalt "einrollt", der neue dann ausrollt usw., Ladeanimation wäre damit einfacher.
Um eine extra PHP datei wird man aber auch so nicht rumkommen.
Wenn du damit Traffic sparen willst, bringt das aber vermutlich nicht so sonderlich viel, da die paar KB von header/menus/footer vermutlich nicht den Großteil ausmachen, sondern eher Grafiken, und die Headergrafik wird ja bei den meisten Besuchern gecached bspw.
Über jQuery habe ich schon viel gelesen aber so richtig wüsste ich jetzt nicht wie ich da was anstellen sollte um das so hinzubekommen. :redface:
Gibt es irgendwo ne Documentation?
Hatte ich auch schonmal drüber nachgedacht aber ich denke es ist die arbeit die man reinstecken müsste um einen sauberen und schönen code zu haben nicht wert den wie jpw bereits gesagt hat macht es dann im endeffekt nicht den großen unterschied es sei denn es geht um die optik.
Wenn man ein bischen rumbastelt klappt es auch ohne viel zu ändern denke ich aber es ist dann hallt bastelei ;)
In erster Linie geht es mir um die Optik...werde mir morgen mal das von didith anschauen vielleicht hilft das ja schon und gegen basteln habe ich sowieso nix das mache ich sowieso gerne :biggrin1:
Was das Hauptprobem ist, sind die fehlenden Angaben der action="" in den Formularen im VMS. Aber auch das lässt sich beseitigen :wink:
Hab mal eine sehr einfache Form davon auf:
http://jpwfour.kilu.de/
eingebaut, einloggen, dann auf den AJAX Link auf der Startseite.
ajax.php im Hauptverzeichnis:
In der header.php natürlich jQuery rein, dann noch ganz untenPHP-Code:<?php
if (isset ($_GET['content']) && !empty ($_GET['content'])) {
if (strpos ($_GET['content'], '../') !== FALSE) die ('Zugriffsverletzung !');
if ($_GET['content']{0} != '/') $_GET['content'] = '/'.$_GET['content'];
}
require ('lib/functions.lib.php');
db_connect();
require ('lib/session.lib.php');
require ('lib/layout.lib.php');
require ( 'lib/extras.lib.php' );
if (!isset($_GET['content']) || empty ($_GET['content'])) $_GET['content'] = '/intern/startseite';
if (!file_exists('content'.$_GET['content'].'.php')) $_GET['content'] = '/error/keine_seite';
require ( './content'.$_GET['content'].'.php' );
db_close();
exit;
?>
In diesem div wird dann "ausgetauscht".HTML-Code:<div id="ajaxc">
In die footer.php ganz oben:
Damit nicht alle Links ausgetauscht werden, man aber andereseits auch nicht jeden Link einzeln editieren muss, hab ich in der layput.lib.php die Menus auch in ein <div> gepackt, dazu:HTML-Code:</div> <!-- #ajaxc, header.php -->
Also neu ist <div class="ajaxm"> bzw. </div>PHP-Code:function menuehead($titel){
echo'
usw was bisher drinwar
<div class="ajaxm">
';
}
function menuefoot(){
echo'
</div>
usw was bisher drinwar
';
}
So, bisher sollte sich noch nix geändert haben :biggrin1:Das kommt dann durch den Code in der footer.php, ganz unten nach </body> und vor </html>:
Die 1. Zeile dient nur zum Test die gefundenen Links hervorzuheben.HTML-Code:<script>
$(".ajaxm a[class!=noaj]").css("border", "2px dotted blue");
$(".ajaxm a[class!=noaj]").click(function (event) {
turl = $(this).attr("href");
treffer = turl.match(/content=[\/a-z0-9]+/i);
$("#ajaxc").slideUp('fast', function() {
$('#ajaxc').load('ajax.php',""+treffer, function() {
$("#ajaxc").slideDown();
$("#ajaxc form").each( function(index, elem) {
if($(elem).attr("action") == ""){
$(elem).attr("action", "index.php?"+treffer);
}
});
});
});
event.preventDefault();
});
</script>
Dann die URL (also href="") von dem geklickten Link, den alten Inhalt einfahren, die URL dann über die ajax.php abrufen, wenn fertig gealden, wird der Inhalt automatisch ersetzt, dann wieder ausfahren.
Danach wird noch in jedem <form> geschaut, wenn action="" leer ist, dann die URL reinsetzen.
Das beinhaltet jetzt natürlich noch keine gute Fehlererkennung etc. aber es funzt schon mal, die genaue Animation ist ja dann noch beliebig austauschbar.
http://docs.jquery.com/Main_Page Dokumentation
Traffic sparen kann man, in dem man die Javascript Datei direkt einbindet von:
Muss der Besucher halt dann freigegeben haben.HTML-Code:<script src="http://code.jquery.com/jquery-latest.min.js"></script>
--
Manche Links sollen davon aber dennoch nicht betroffen sein, bspw. der Logout, da reicht es, dem <a> Tagzu verpassen.HTML-Code:<a class="noaj" ....
Über die Selektoren von jQuery sind einem da ja keine Grenzen gesetzt :thumb:
So dann warte ich mal auf VMS 1.25 mit Live Ajax Content :biggrin1:
Also eigentlich sieht das ja schon ganz gut aus nur müsste man dann hallt die formulare und co auch auf ajax umstellen.
Das ist echt mal geil...den rest kann ich dann schon zusammenkloppen aber so ist es schoneinmal genau das was ich gesucht habe!
Echt Großen Dank :thumb::thumb::thumb:
so habs gerade auch mal am testen lustigerweise zeigt er mir die unterseiten wenn ich sie über ajax aufrufe ohne umlaute an.
wenn ich ganz normal zugreife sind die umlaute da, über ajax werden sie durch spacer ersetzt :frusty:
hmm keine ahnung warum die Umlaute nicht anzeigt werden...bei mir übrigens auch nicht...
habe das :
auch schon versucht in die ajax.php einzugeben brachte aber keine änderung...naja ist wahrscheinlich sowieso besser die Sonderzeichen in Unicode zu schreiben (http://www.html-world.de/program/html_sz.php) ansonsten gibt es ja auch editoren wie weaverslaver die alle sonderzeichen => unicodes ändern...PHP-Code:header('content-type: text/html; charset=utf-8');
ich hab bei den meisten unterseiten die per txt eingelesen werden mir sowieso schon ne funktion geschrieben die die umlaute mit codes ersetzt aber ich hab eigentlich keine lust die ganzen unterseiten zu editieren :frusty:
Wird bei dir wenigstens die formulare angezeigt das klappt bei mir irgendwie auch nicht muss mich da mal einlesen wenn ich zeit habe.
wenn <form> nicht innerhalb <table> ist wird das formular bei mir angezeigt
Umlaute müssen in Unicode geschrieben werden, da Ajax i.d.R. nur für UTF8 gedacht ist.
Als kleinen jQuery-Denkansatz:
Code:// Formulare innerhalb vom DIV-Container
// mit der ID "content" auf jQuery umleiten
$("#content form").submit(function(){
var url = "ajax.php?"+$(this).attr("action");
var method = $(this).attr("method");
var method = method.toLowerCase();
var showPage = function (data) {
$('#content').html(data);
$('#content').fadeIn('normal');
}
var params = {};
for(var i=0; i<this.elements.length; i++) {
e = this.elements[i];
params[e.name]=e.value;
}
if (methos == "post") { $.post(url, params, showPage); }
else { $.get(url, params, showPage); }
return false;
});
// Alle Links innerhalb von dem DIV-Container umleiten
$(document).ready(function() {
$("#content").click(functions(){
$("a").each(function () {
$.get("ajax.php?"+$(this).attr(href), "", function(data){
$('#content').html(data);
$('#content').fadeIn('normal');
});
});
});
});
erinnert mich an chinesisch :biggrin1:Zitat:
Zitat von SebbyPHM
Naja PHP war ja anfang auch chinesisch für mich...mitlerweile geht es eigentlich schon ganz gut...aber das wird schon einfach mal nen schönes Buch über AJAX kaufen :cool:
Wenn ich das richtig verstehe ist das ein ansatz um die formulare umzuleiten? oder sehe ich das falsch?Zitat:
Zitat von SebbyPHM
@WaechterMedia: Siehst du richtig.
@Hardy: jQuery wird aber anders geschrieben als beispielsweise Mootools oder sriptalacous oder wie das geschrieben wird. Es gibt genügend Tutorials und Manuals.
Hi jpwfour :biggrin1:
ich mal wieder, ist es auch möglich den slideup,slidedown effekt mit solch ein loader zu ersetzten?
http://www.speldhurstcc.org.uk/images/ajax-loader.gif
Vermutlich ja aber ich bin noch auf keine lösung gekommen, ein denkansatz wäre schön.
Noch ein Problem, links innerhalb des Content gehen leider nicht so, auch nicht wenn ich class="noaj" verwende. Geht doch wenn man <div class="ajaxm"> auch in head(),foot() einbaut ;) aberleider nicht innerhalb von tabellen wie es aussieht.
Achso eine lösung wäre noch gut das die form tags innerhalb einer tabelle auch funktionieren.,die gehen nämlich bei mir auch nicht :(
edit: der "Bedanken" Button fehlt hier ?!
Macht Sinn, "wenn's mal wieder länger dauert" :wink:
Hab das mal nachgerüstet bei der Demo:
http://jpwfour.kilu.de/index.php?ajax=1
Vorallem auf der Refrallye (link links unten) sieht mans, die dauert lang (5 Sekunden :biggrin1:)
Sieht jetzt nicht sonderlich toll aus, aber sowas kann ich halt auch nicht :rant:
Im Prinzip hab ich nur in der footer.php den Loader reingesetzt unter den Inhalt:
Un dann im Skript dafür gesorgt, dass dieses DIV eingeblendet wird, sobald das anderen "hochgeslidet" ist, und wieder ausgeblendet, sobald der neue Inhalt da ist:HTML-Code:</div> <!-- #ajaxc, header.php -->
<div id="ajwait" style="display:none;background-image:url(http://www.speldhurstcc.org.uk/images/ajax-loader.gif); height:175px;width:200px;">
</div>
Das Sliden wär evtl auch schöner, mit ein/ausblenden, da gibts ja in jQuery viele Möglichkeiten:Code:$(".ajaxm a[class!=noaj]").css("border", "2px dotted blue");
$(".ajaxm a[class!=noaj]").click(function (event) {
turl = $(this).attr("href");
treffer = turl.match(/content=[\/a-z0-9]+/i);
$("#ajaxc").slideUp('fast', function() {
$("#ajwait").show(); // neu
$('#ajaxc').load('ajax.php',""+treffer, function() {
$("#ajwait").hide(); // neu
$("#ajaxc").slideDown();
$("#ajaxc form").each( function(index, elem) {
if($(elem).attr("action") == ""){
$(elem).attr("action", "index.php?"+treffer);
}
});
});
});
event.preventDefault();
});
http://api.jquery.com/category/effects/
EDIT: evtl gehen die bedanken buttons nicht, da die beiträge vor dem einbau der bedanken funktion erstellt wurden, k.a.
Jetzt noch die Browser-Navigation gangbar machen und es ist top ;).
Hallo Leute!
Habe das ganze bei mir auch eingebaut und klappt wunderbar :)
Jetzt habe ich mich daran gemacht einen Workaround für die Formulare zu basteln. Dabei habe ich mir das ganze so vorgestellt:
Ein AJAX Formular, das ein PHP Script lädt, dieses führt die Datenbankabfrage durch.
Das ganze funktioniert auch schon, aber nun möchte ich noch das der Content nochmal refresht wird. Überlegt habe ich mir folgendes:
Ich lasse ganz einfach per AJAX den Content wieder neuladen mit diesem Befehl:
Das ganze Funktioniert auch. Aber nur solange ich nicht meine Datenbankabfrage vorher reinschalte. Dann macht er die Datenbankabfrage, aber lädt den Content nicht neu, sondern zeigt ein weißes Bild an.Code:<script>
$('#ajaxc').load('ajax.php?content=/game/train');
</script>
Hier nochmal der Ausschnitt mit der Abfrage:
Code:db_query("INSERT INTO game_training_prog (uid,id,start,bis) VALUES (".$_SESSION['uid'].",".$tr['id'].",".time().",".(time()+$tr['dauer']).")");
?>
<script>
$('#ajaxc').load('ajax.php?content=/game/train');
</script>
<?php an anfang nicht vergessen
Hallo,
ich brauche hilfe bei folgenden sachen:
1. Ajax läuft nur bei eingeloggten Usern.
(Wie geht es das ich es auch bei nicht eingeloggten Ajax funktioniert?)
2. Wie baue ich ein Formular um das es über Ajax läuft?
(Beispiel: die Anmeldung/Userprofil/Support)
3. Wie lasse ich einzelne Texte weiterhin wie gewohnt refreshen?
(z.B Jackpot-Anzeige im Header/Wer ist Online im rechten menü)
4. Wie kann ich einzelne Links über Ajax laufen lassen?
(z.B die Links im Content)
Wer Intresse hat und sich auch wirklich damit auskennt, kann sich gerne per PN melden. Wir können auch über einen Messenger miteinander schreiben, schreibt einfach welchen Messenger ihr benutzten möchtet (Msn, ICQ, Skype, Google Talk).
Hinweis:
Natürlich werde ich die Hilfe auch mit Losen vergüten, das werden wir dann per PN oder einem Messenger vorher abklären.
Danke :thumb: