Die go_ajax.js Datei (im Seitenlayout einbinden)
Code:
var go_ajax = function (element, updateid, column) {
var to_update = $(updateid);
$$(element+' a').each(function(el){
el.addEvent('click', function() {
$$(element+' ul li.active').each(function(e2){e2.removeClass('active')});
var url = el.href;
var urlextend = url+"?request="+column;
var fadeout = to_update.fade(0.0);
var req = new Request.HTML({
url: urlextend,
method: 'post',
onRequest: function(){ },
onComplete: function(responseTree, responseElements, responseHTML, responseJavaScript){
to_update.fade(1.0);
}
})
req.addEvent('success',function(responseTree, responseElements, responseHTML, responseJavaScript)
{
to_update.set('html',responseHTML);
$exec(responseJavaScript);
});
req.send();
el.parentNode.addClass('active');
return false;
});
});
}
Das Seitentemplate muss die go_ajax.js laden! Das fe_seitenlayout.tpl (oder ab Contao 2.10 eben .xhtml) muss so aussehen...
Code:
<?php if(!isset($_GET['request'])): ?>
Dann alle normalen Inhalte eines normalen Seitentemplates...
Im Header noch dieses Script einbauen (muss von den DIVs an das eigene Layout angepasst werden!!! Bei mir werden so 2 DIVs nachgeladen! Aber wenn die Links im Selben DIV liegen der nachgeladen werden soll klappt das nicht --HILFE gerne angenommen)
Code:
<script src="js/go_ajax.js" type="text/javascript"></script>
<script type="text/javascript">
window.addEvent('domready', function(e) {
go_ajax(
'#navigation', // ID oder class des/der divs in dem die a tags liegen die aufgerufen werden sollen
'inhaltmain', // id des divs, welcher geupdated werden soll, ohne Raute!
'main' // Angabe der Spalte die man benutzen möchte
);
go_ajax(
'#navigation', // ID oder class des/der divs in dem die a tags liegen die aufgerufen werden sollen
'slider', // id des divs, welcher geupdated werden soll, ohne Raute!
'header' // Angabe der Spalte die man benutzen möchte
);
go_ajax(
'#inhaltmain', // ID oder class des/der divs in dem die a tags liegen die aufgerufen werden sollen
'inhaltmain', // id des divs, welcher geupdated werden soll, ohne Raute!
'main' // Angabe der Spalte die man benutzen möchte
);
});
</script>
Am Ende des Templates diesen Code einfügen
Code:
<?php else: echo $this->$_GET['request']; endif; ?>
<script type="text/javascript">
Cufon.refresh();
Mediabox.scanPage();
</script>
Das Script am Ende bewirkt, dass die Mediabox auch nach dem Nachladen klappt. Dasselbe für Cufon (sofern man es denn eingebaut hat -- sonst entfernen)
Das Ergebnis klappt (zumindest vor Contao 2.10) -- aber eben nicht ganz ohne Probleme. Wie oben erwähnt klappt es nicht wenn die Links im selben DIV liegen, der nachgeladen werden soll (z.B. bei News Liste, Galerie Liste,...). Man kann in de Go_Ajax auch eine Klasse definieren, die die entsprechenen Links vorweisen müssen. Dazu müsste man noch die nav_default ändern!
Diese Vorgehensweise basiert auf einem alten Thread und sollte nach möglichkeit auf einen aktuellen Stand gebracht werden. Ich komme aber grad nicht dazu hier weiterzutesten...
Seitennachladen via Ajax
Zitieren
Lesezeichen