---
title: "Dynamischer Seiteninhalt via JQuery"
url: "https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery"
source: "typo3.net"
tags: ["Archiv","TemplaVoilà","Frage","JavaScript & AJAX","TYPO3 6.x"]
created: "2015-03-19"
last_reply: "2015-03-20"
replies: 3
solved: true
page: 1
pages: 1
lang: "de"
---

# Dynamischer Seiteninhalt via JQuery

Archiv › TemplaVoilà · 3 Antworten · gelöst · gestartet 2015-03-19

## Frage

**Snob1337** · 2015-03-19 · [Beitrag #1](https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery/1)

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:

```typoscript
# 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:

```javascript
$(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 :D )
<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

## Beste Antwort

**jenses** · 2015-03-20 · [Beitrag #2](https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery/2)

Du brauchst ein zweites HTML-Template, welches du in TV mappst und dann den Unterseiten zuweist.
Dieses Template erhält nur den Content, aber keine Menüs usw.
"nurInhalt = PAGE" und das weitereGerödel kannst du rausschmeißen.
"disableAllHeaderCode" für das Unterseiten-Template läßt sich per Condition setzen,
mußt du mal schauen in der TV-Doku - da gibt es eine Condition für die Uid des TV-TO's.

## Antworten

### [#2](https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery/2) · jenses · 2015-03-20 · Beste Antwort

(Text siehe oben unter „Beste Antwort“.)

### [#3](https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery/3) · Snob1337 · 2015-03-20

Vielen Dank für deine Antwort :)
Ich teste das im Laufe des Tages mal und gebe eine Rückmeldung ;)

Grüße,
Marc

### [#4](https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery/4) · Snob1337 · 2015-03-20

Habs direkt getestet... ES GEHT !!!!

VIELEN HERZLICHEN DANK :) :)

---

Quelle: „Dynamischer Seiteninhalt via JQuery“, typo3.net, https://www.typo3.net/d/119931-dynamischer-seiteninhalt-via-jquery
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.