Hallo liebe Community,
ich versuche mal mein Problem zu beschreiben... hoffe es gelingt mir halbwegs 🙂
ich habe ein template via Templavoila gemappt und auf verschiedenen Seiten Inhalte gepflegt.
Nun möchte ich, dass nur die erste Seite geladen wird und über kacheln die weiteren Seiten (NUR Inhalt) in einen Div geladen werden.
Sprich, mein Template hat 2 Spalten und auf der Startseite sind in der linken Spalte 6 Kacheln und auf der rechten Seite soll der Inhalt der jeweiligen Seite geladen werden, mit welcher die Kachel verlinkt ist. Momentan wird die verlinkung noch über das Menü gelöst. Aber das ist mal noch egal.
ich habe ein Tutorial gefunden, in welchem eigentlich genau das gemacht wird was ich gerne hätte.
Leider wollte das ganze bei mir nicht so recht... und nun wird im rechten Div nicht nur der Inhalt der Seite dargestellt, sondern immer die KOMPLETTE Seite (inkl. footer,Menu,etc)
Folgendes steht in meinem Root-Template-Setup:
# Standardseite
page = PAGE
page.10 = USER
page.typeNum = 0
page.10.userFunc = tx_templavoila_pi1->main_page
page.10.disableExplosivePreview = 1
#Laut Tutorioal muss ein weiteres Template generiert werden, welches dafür sorgt,
#dass nur der Inhalt dargestellt wird
nurInhalt = PAGE
nurInhalt.typeNum = 101
nurInhalt.10 < page.10
nurInhalt.10.template.file = fileadmin/templates/nurInhalt.html
# Im Templatefile "nurInhalt.html" steht, wie im tut beschrieben, folgendes:
# ###CONTENT###
nurInhalt.config {
disableAllHeaderCode = 1
disableCharsetHeader = 1
disablePrefixComment = 1
}
Mein Javascript sieht folgendermaßen aus:
$(document).ready(function() {
//Auf den ggf. übermittelten Anker reagieren
if(location.hash) {
x = location.hash;
getContent(x.slice(1)+".html");
}
//Links per Ajax nachladen
//$("a:not([href^='http://'])").click(function() {
$(".sf-menu a").click(function() {
url = $(this).attr("href");
getContent(url);
$(this).blur();
return false;
});
//Informieren das etwas passiert
$("#mainRight").ajaxStart(function() {
$(this).fadeOut(function() {
$(this)
.text("")
.addClass("loading")
.fadeIn();
});
});
});
/*
* Holt den Inhalt vom Server
*/
function getContent(url) {
$.ajax({
//erweitere aufzurufenden Link
url: url.replace(/.html/, "/ajax.html"),
//url: url+"type=101",
//dataType: "html",
//wenn es geklappt hat
success: function(html) {
//Inhalt reinschreiben und anzeigen
$("#mainRight")
.removeClass("loading")
.css("display", "block")
.html(html)
.fadeIn();
//Adresszeile aktualisieren
location.hash = url.replace(/.html/, "");
}
});
}
wie man sieht, sind momentan die Menülinks verknüpft und das JS reagiert entsprechend.
Nun meine eigentliche Frage:
(Sorry dass es so viel Text ist, aber ich weiß nicht wie ich das alles sonst beschreiben soll 🙂 )
hier mal ein Link zur Seite (ich weiß, sieht fürchterlich aus... ist aber auch nur ein Test 😃 )
http://typo3.p253584.mittwaldserver.info/index.php?id=6
Bei Klick auf den menüpunkt "Inhaltselemente" wird die Seite in den rechten Div geschrieben.
Was muss gemacht werden, damit nicht mehr die Komplette Seite im rechten Div dargestellt wird,
sondern nur der Text ab den vielen #-Zeichen?
ich bin gerne auch bereit das mit jemandem gemeinsam via TeamViewer anzuschauen 🙂
Momentan klappt das mit dem URL-Parameter "type=101" noch nicht so ganz, den dann einfach händisch anfügen.
Ich hoffe sehr jemand hat eine Idee 🙂
und schonmal VIEEEELEN Dank für den jenigen der sich die Mühe macht all das zu lesen 😉
Der Problemlöser bekommt ein Bier spendiert 😉 (Raum Ludwigsburg... oder per Post)
Grüße,
Marc