Einen schönen Wochenstart allen,
ich benötige einen Ansatz für den html-Aufbau eines Buchungskalenders.
Ich erstelle eine Tabelle, bei der in der ersten Spalte "Shops" aufgeführt sind und in der zweiten Spalte ein Kalender (Tage, zu Wochen aggregiert), wobei jeder Shop einen eigenen Kalender hat. Sagen wir mal stets fünf Wochen == 35d.
Woche 15 | Woche 16
Shop A --x-xxx | --x-xx-
Shop B xxxxxxx | xxx-xx-
Shop C --x---- | ----xx-
Die Wochen sind per Javascript weiterschaltbar. Zu den Tagen gibt es Statusinformationen, die aus einer DB gerufen werden. Durch das Weiterschalten bedingt, wird AJAX verwendet, da sonst unendlich viele Informationen zum Klienten gesendet werden müssten.
Ich suche jetzt nach einem geeigneten html-Aufbau.
Wenn ich eine Woche weiterschalte, sollen die Shops stehenbleiben wie sie sind. Daher fällt mir momentan nur ein, nicht mit einer Tabelle zu arbeiten sondern mit divs.
<div class='shops'>
<div>ShopA</div>
<div>ShopB</div>
<div>ShopC</div>
<div>ShopD</div>
<div>ShopE</div>
<div>ShopF</div>
</div>
<div class='bookings'>
<div>... Kalender ...</div>
</div>
Das alles mit ziemlich viel gefloate und immer darauf achten, dass die Bookings die gleiche Höhe haben, wie die Shops. Semantisch wäre eigentlich sowas schöner:
<table>
<tr>
<td>ShopA</td>
<td>...KalenderA...
</tr>
<tr>
<td>ShopB</td>
<td>...KalenderB...
</tr>
<tr>
<td>ShopC</td>
<td>...KalenderC...
</tr>
<tr>
<td>ShopD</td>
<td>...KalenderD...
</tr>
</table>
Doch so kommen die Kalender-Daten nicht aus dem Callback vom AJAX-Request. Ich könnte auch für jede einzelne Zeile einen eigenen AJAX-Request erstellen und dann für ein "Wochenvorblättern" alle Zeilen veranlassen zu blättern. Aber das finde ich kompliziert.
Was würdet Ihr vorschlagen, wie sich das am simpelsten lösen lässt, was das html angeht.
Cheers,
Baba