Details eines Item nachladen

[tognit]

Guten Morgen zusammen

Ich habe eine Seite mit einer Übersichtsliste. Jetzt möchte ich die Details eines Items nach klick auf der gleiche Seite per AJAX nachladen.

<div id="item1"> Item 1 </div>
<div id="item2"> Item 2 </div>
<div id="item3"> Item 3 </div>
<div id="item4"> Item 4 </div>
<div id="inhalt"> Hier solte der Inhalt des gewählten Items nachladen. </div>

[MacKP]

Hallo tognit,
dann lass dir in der Liste auch einfach die Details ausgeben. Dann hast du die schon mal Grundsätzlich zur Verfügung. Nu kannst mit JS machen was du willst.
Wenn du JS hilfe brauchst, dann kannst du dir vllt einen anderen Thread anschauen, wo Xtra gepostet hat, wie man dynamisches Nachladen von Items in einer Liste macht (musst mal suchen, Link hab ich gerade nicht).

Viele Grüße

[tognit]

Hallo MacKP

Danke für deine Antwort.

Ich möchte aber die Details erst nach einem klick auf den Link ausgeben lassen, weil auch Videos vorhanden sind und diese bei einem z.B. Akkordeon weiterlaufen wenn das Akkordeon geschlossen wird. Daher ein nachladen per AJAX.


Der Link: Katalog-Liste-via-Ajax-nachladen
Eine kleine Erklärung dazu wie ich das für mich nutzen kann, wäre Super.

[MacKP]

Hallo tognit,
deswegen ja auch erst mal im Modul nur ankreuzen, damit das überhaupt verfügbar ist (wenn es im Template nicht ausgegeben wird, dann wirds ja nicht länger dauern) ;-)

Anleitung die ich dazu habe: lies den Code. Mehr hab ich nicht. Aber vllt gibts hier noch welche, die dir helfen wollen/können.

Viele Grüße

[tognit]

Hallo zusammen

Bin fast am Ziel! Nur klappt es noch nicht ganz so wie ich es brauche.

Es ist jetzt so, das nach dem klicken die url so geladen wird: www.meinedomain.ch/?items/1.html

Wie muss der Code unten so angepasst werden, dass der get parameter kein ? mit schickt?

<script type="text/javascript">
/* <![CDATA[ */
window.addEvent('domready', function() {
	var myRequest = new Request.HTML({
          method: 'get',
          url: 'www.meinedomain.ch/',
		onSuccess: function(html) {
			$('ausgabe').set('text', '');
			$('ausgabe').adopt(html);
		}
	});
<?php foreach ($this->entries as $entry): ?>
	$('item<?php echo $entry['id']; ?>').addEvent('click', function(event){
		event.stop(); 
                myRequest.send('items/<?php echo $entry['id']; ?>.html');
	});
<?php endforeach; ?>
});
/* ]]> */
</script>

<div id="item1"> Item 1 </div>
<div id="item2"> Item 2 </div>
<div id="item3"> Item 3 </div>
<div id="item4"> Item 4 </div>
<div id="ausgabe"> Hier solte der Inhalt des gewählten Items nachladen. </div>

@MacKP
Die habe ich alle angekreuzt.