ZF2 & AJAX - Seite aktualisieren

Aktuelle Programmier- und Auszeichnungssprachen HTML / CSS / JavaScript
1

Hallo Leute,
nachdem ich eben mein Problem alleine durch einen Beitrag hier im Forum lösen konnte, versuch ich das doch gleich nochmal :stuck_out_tongue_winking_eye:
Spaß bei Seite, ich hab ein verständnisproblem / konstruktionsproblem, wie man es auch nennen möchte.

Kurz zum Aufbau:

  • Die Seite wird geladen (indexAction vom Controller wird ausgeführt…), die aktuellen Einträge (max. 10) werden aus der Datenbank gelesen. Zusammen mit den gelesenen Werten wird dann ein ViewModel erzeugt. In der index.phtml läuft dann eine Schleife über alle Einträge der DB und die Einträge werden entsprechend hübsch angezeigt.

Nun wählt der Benutzer einen Status X aus einer Select-box aus. Wenn das getan ist, wird via. AJAX eine neue Datenbankabfrage gemacht (gleiche Tabelle wie zuvor). Diesesmal werden aber die Daten abgefragt, die den Status X haben.

Nun zu meinem Verständnisproblem.
Wie zeige ich die Daten nun korrekt auf meiner Seite an?

Ich habe bisher 2 Möglichkeiten im Kopf…und irgendwie hab ich das gefühl, dass beide nicht sauber sind.

Möglichkeit 1:

  • Ich baue mir das HTML auf serverseite zusammen, gib das komplette HTML als Antwort zurück und ersetze es durch das Javascript.

Möglichkeit 2:

  • Ich gebe ein JSON zurück und baue das HTML in meinem Javascript neu zusammen.

Wie erwähnt glaube ich, dass beide Varianten nicht sauber sind, da ich das HTML (welches ja an sich schon in der index.phtml liegt) immer wieder neu „bastle“.

Ich hoffe mein Problem ist einigermaßen verständlich und jemand kann mir helfen :slight_smile:

2

Ich habe es nun erst mal folgendermaßen gelöst:

  • ich habe mir eine layout-Datei für die Darstellung der items geschrieben
  • aus diesem Layout erstelle ich mir ein ViewModel

public function searchAction() {
//...
		$v2 	= new ViewModel(array(
				'data' => $data,
			));
		$v2->setTemplate("layout/myLayout");
		$v2->setTerminal(true);
		return $v2;

und innerhalb meines Javascriptes gehe ich dann hin und ersetze den kompletten Block, durch das HTML was mir zurückgeliefert wird.


	$.ajax({
		type: "POST",
		url: "Uebersicht/search",
		data:myData,
		success: function(data){
			document.getElementById("container").innerHTML = data;
		},
		failure: function(){
			alert("Failure!!");
		}
	});

zumindest ist diese Art für mein empfinden sauber programmiert bzw. ich habe zumindest keine Programmteile doppelt in Verwendung.
Bleibt nach wie vor die Frage:
gibt es hier noch bessere Lösungen?