Frontendausgabe der Datensätze in Tabelle

Guten Abend miteinander,

klasse Extension, ich bin begeistert.
Ich habe auch soweit die ersten Modelle anlegen können, Frontend-Editing klappt usw.

Um die Frontend-Anzeige besser steuern zu können, würde ich gerne, dass ich die eingegebenen Datensätze in einem table-Element ausgeben kann.
Übersehe ich hier eine Board-Funktionalität oder kann man dies einfach selbst bewerkstelligen?

Ich habe versucht, das Ganze über die prerendered/unrendered-Templates anzupassen, bin dort aber nicht schlau geworden.

Über Tipps freue ich mich!

Beste Grüße
Alexander

was genau ist das Problem?

ggf. hilft das schon weiter https://metamodels.readthedocs.io/de...templates.html

Etwas ausführlicher:

Baue den Rahmen der Tabelle in Template, das auf einem mod_metamodels_list-Template basiert. Da kannst Du beispielsweise <table> und <thead> nutzen. Möglicherweise kannst Du an dieser Stelle auch ein wenig Javascript einbauen, um die Tabelle filter- oder suchbar zu machen. Beispielsweise: https://fooplugins.com/footable/ oder auch https://datatables.net/. Es gibt da noch mehr.

Baue die Ausgabe der Items in einem Template, das auf dem metamodel_prerendered-Template basiert. Dort kannst Du die einzelnen Itemausgaben in <tr> und <td> verpacken. Auch für die Elemente der items kannst Du jeweils individuelle Templates nutzen zum Beispiel, um die Detaillinks anders zu verpacken.

... eigentlich reicht es, ein eigenes metamodel_prerendered_table-Template anzulegen und entsprechend mit den Tabellenangaben zu gestalten (per table oder per CSS - siehe https://metamodels.readthedocs.io/de...telements.html)

... die Filterungen und Sortierungen kannst Du auch per MetaModels machen - dafür sind die ja da ;-)

Eine richtige Tabelle finde ich spätestens in der Mobileansicht nicht mehr so schick. Kommt natürlich darauf an, wie viele Spalten man hat.

So sieht eins von meinen "Tabellentemplates" aus, also da wo ich am Desktop eine Liste zeige.

PHP-Code:

---

<?php $strRendersettings = isset($this->settings) ? 'settings' : 'view'; ?>
<?php if (count($this->data)) : ?>

<span class="total"><?php echo $this->total ?><?php echo " Treffer f&uuml;r die festgelegte Auswahl:" ?></span><br /><br />

<div class="layout_full">

<div class="header col">Foto</div><div class="header col">Überschrift Titel</div><div class="header col">Überschrift Feld 1</div><div class="header col">Überschrift Feld 2</div>
<?php foreach ($this->data as $arrItem) : ?>
<div class="item <?php echo $arrItem['class']; ?>">
    <div class="col"><?php echo $arrItem['html5']['foto_gesamt']; ?></div>
    <div class="col">
        <?php if ($arrItem['jumpTo']['deep']): ?>
            <a href="<?php echo $arrItem['jumpTo']['url']; ?>" title="<?php echo $arrItem['text']['titel']; ?>" ><?php echo $arrItem['text']['titel']; ?></a>
        <?php endif; ?>
    </div>
    <div class="label"><?php echo $arrItem['attributes']['feld1']; ?>: </div>
    <div class="col"><?php echo $arrItem['text']['feld1']; ?></div> 
    <div class="label"><?php echo $arrItem['attributes']['feld2']; ?>: </div>
    <div class="col"><?php echo $arrItem['text']['feld2']; ?></div>

</div>
<?php endforeach; ?>
</div> 
<?php else : ?>
<p class="info"><?php echo $this->noItemsMsg; ?></p>
<?php endif; ?>

---

Zur Tabelle wird es dann mit CSS in der Desktopansicht, mobil sind es "Kacheln". Das geht sicher noch viel eleganter, aber vielleicht hilft es dir trotzdem.

Für tabellarische Daten sind Tabellen auch im Jahr 2019 immer noch das richtige Element. Um Tabellen responsiv darzustellen gibt es ja entsprechende Möglichkeiten.

zieht euch mal die aktuellen Templates...

PHP-Code:

---

<?php $strRendersettings = isset($this->settings) ? 'settings' : 'view'; ?>

---

ist obsolet

für

PHP-Code:

---

$arrItem['jumpTo']['deep'] 


---

gibt es nun einen action-Block

Tipp: Kurzform für "echo" reicht

PHP-Code:

---

    <div class="col"><?= $arrItem['html5']['foto_gesamt'] ?></div>

---

@lucina: Na ja, kommt drauf an, was man will, braucht, kann usw. Scrollen finde ich mobil z.B. nicht so toll, genauso wenig wie Spalten weg lassen. Das komplett mit CSS umzustellen, wenn die Breite sich verringert, ist sicher auch nicht Jedermanns Sache. Meine wars jedenfalls nicht. Aber ich bin kein Profi wie ihr es seid. Ich finde Beispiele nur oft hilfreicher als rein verbale Tipps. Die verstehe ich oft gar nicht. Und selbst wenn der Fragensteller auch so klar gekommen wäre, hilft es vielleicht wem anders.

@zonky: O.k. danke, das schaue ich mir nochmal an.

Ich finde sowas jetzt nicht unübersichtlich (und es kommt mit CSS aus): https://codepen.io/vasansr/full/PZOJXr/

Ja, das ist für diese Art von Tabelle super gelöst, aber es kommt eben auch immer darauf an, was für eine Art von Tabelle es ist.

ob table oder div war ja nicht die Frage, sondern eher welches Template man anfassen muss und wie... Rest ist "Geschmackssache"

Hallo miteinander,

zunächst: vielen Dank für eure zahlreichen Eintrge. Entschuldigt, dass ich zwar den Thread gestartet, dann aber inaktiv war.
Mit eurer Hilfe habe ich mich nun zum richtigen Template vorgearbeitet und bekomme auch eine Ausgabe im Tabellenformat hin. Da ich aber kein Entwickler bin, sondern eher begeisterter Hobbyanwender, hakt es an der ein oder anderen Stelle dann doch noch.
Folgendes habe ich mir zusammengeschustert:

PHP-Code:

---

<?php if (count($this->data)): ?>

<div class="layout_full">
<p>Das ist eine Tabelle</p>

<table class="table">
  <thead>
    <tr>
    <?php foreach ($this->data as $arrItem): ?>
        <?php foreach ($arrItem['attributes'] as $field => $strName): ?>
            <?php if ((isset($arrItem[$this->getFormat()][$field]) && ($strValue = $arrItem[$this->getFormat()][$field])
                || (isset($arrItem['text'][$field]) && ($strValue = $arrItem['text'][$field])))): ?>
                <th class="item <?= $arrItem['class'] ?>" scope="col"><?= sprintf($GLOBALS['TL_LANG']['MSC']['field_label'], $strName) ?></th>
            <?php endif; ?>
        <?php endforeach; ?>
        <?php foreach($arrItem['actions'] as $action): ?>
            <th>
            <span>Aktion</span>
            </th>
        <?php endforeach; ?>
    <?php endforeach; ?>
    </tr>
  </thead>
  <tbody>
    <?php foreach ($this->data as $arrItem): ?>
    <tr>
        <?php foreach ($arrItem['attributes'] as $field => $strName): ?>
            <?php if ((isset($arrItem[$this->getFormat()][$field]) && ($strValue = $arrItem[$this->getFormat()][$field])
                || (isset($arrItem['text'][$field]) && ($strValue = $arrItem['text'][$field])))): ?>
                <td scope="row"><?= $strValue ?></td>
            <?php endif; ?>
        <?php endforeach; ?>
        <?php foreach($arrItem['actions'] as $action): ?>
            <td>
            <?php $this->insert('mm_actionbutton', ['action' => $action]); ?>
            </td>
        <?php endforeach; ?>
    </tr>
    <?php endforeach; ?>
   </tbody>
</table>


<?php else : ?>
<?php $this->block('noItem'); ?>
<p class="info"><?= $this->noItemsMsg ?></p>
<?php $this->endblock(); ?>

<?php endif; ?>

---

Klappt und sieht gut aus (für Testzwecke zumindest). Aber: Bisher werden die Spaltenüberschriften noch x-mal erzeugt. Gibt es x Einträge, gibt es auch x-Spalten mit table-heads (th).
Dasa liegt natürlich an den foreach-Schleifen, die durchlaufen werden. Leider weiß ich nicht, wie ich es darauf begrenze, dass er die th nur einmal ausgibt.
Kann mir hier jemand von den erfahrenen MM'lern unter die Arme greifen?

Danke & Grüße
Alexander

probier mal als direkte Zuweisung

PHP-Code:

---

<?php $arrItem = $this->data[0]; ?>

---

ohne foreach

oder "Klassisch mit einem Zähler" - dann kannst Du die foreach in <table> über alles machen

PHP-Code:

---

<?php $i = 0; foreach ($this->data as $arrItem): ?>
...
<?php $i++; endforeach; ?> 
bzw.
<?php foreach ($this->data as $i => $arrItem): ?>
und
<?php if ($i == 0): ?>
... Header

---

Hi zonky,

besten Dank für deine Antwort.

Wenn ich das [0] hinzufüge, bekomme ich keine <th> mehr ausgegeben.

PHP-Code:

---

    <?php foreach ($this->data[0] as $arrItem): ?>
        <?php foreach ($arrItem['attributes'] as $field => $strName): ?>
            <?php if ((isset($arrItem[$this->getFormat()][$field]) && ($strValue = $arrItem[$this->getFormat()][$field])
                || (isset($arrItem['text'][$field]) && ($strValue = $arrItem['text'][$field])))): ?>
                <th class="item <?= $arrItem['class'] ?>" scope="col"><?= sprintf($GLOBALS['TL_LANG']['MSC']['field_label'], $strName) ?></th>
            <?php endif; ?>
        <?php endforeach; ?>
        <?php foreach($arrItem['actions'] as $action): ?>
            <th>
            <span>Aktion</span>
            </th>
        <?php endforeach; ?>
    <?php endforeach; ?>

---

Wenn ich das foreach wegnehme, bekomme ich einen Contao-Fehler ausgeworfen:

PHP-Code:

---

<thead>
    <tr>
    <?php ($this->data as $arrItem): ?>
        <?php foreach ($arrItem['attributes'] as $field => $strName): ?>
            <?php if ((isset($arrItem[$this->getFormat()][$field]) && ($strValue = $arrItem[$this->getFormat()][$field])
                || (isset($arrItem['text'][$field]) && ($strValue = $arrItem['text'][$field])))): ?>
                <th class="item <?= $arrItem['class'] ?>" scope="col"><?= sprintf($GLOBALS['TL_LANG']['MSC']['field_label'], $strName) ?></th>
            <?php endif; ?>
        <?php endforeach; ?>
        <?php foreach($arrItem['actions'] as $action): ?>
            <th>
            <span>Aktion</span>
            </th>
        <?php endforeach; ?>
    </tr>
  </thead>

---

Mache ich die Anpassungen falsch?

Grüße
Alexander

bei

PHP-Code:

---

<?php foreach ($this->data[0] as $arrItem): ?>

---

was steht in $arrItem ? musst mal Debuggen (siehe Handbuch)

Edit. ist Quatsch: mach $arrItem = $this->data[0]

Hi zonky,

der Array gibt folgendes aus:

Code:

---

<!-- DEBUG START
<pre>
Array
(
    [0] => Array
        (
            [raw] => Array
                (
                    [id] => 6
                    [pid] => 0
                    [sorting] => 0
                    [tstamp] => 1560180441
                    [feld_proz] => Gruppe1
                    [feld_prozow] => Array
                        (
                            [__SELECT_RAW__] => Array
                                (
                                    [id] => 2
                                    [pid] => 0
                                    [sorting] => 0
                                    [tstamp] => 1560182244
                                    [compn] => UNBFS
                                    [compdesc] =>
                                )

                            [compdesc] =>
                            [compn] => UNBFS
                        )

                )

            [text] => Array
                (
                    [feld_proz] => Gruppe1
                    [feld_prozow] => UNBFS
                )

            [attributes] => Array
                (
                    [feld_proz] => feld_proz
                    [feld_prozow] => feld_prozow
                )

            [html5] => Array
                (
                    [feld_proz] => <span class="text">Gruppe1</span>
                    [feld_prozow] => UNBFS
                )

            [class] => first even
            [actions] => Array
                (
                    [edit] => Array
                        (
                            [label] => Edit item
                            [href] => hauptseite/auswahl.html?act=edit&id=mm_test::6
                            [class] => edit
                        )

                    [copy] => Array
                        (
                            [label] => Copy item
                            [href] => hauptseite/auswahl.html?act=copy&source=mm_test::6
                            [class] => copy
                        )

                    [delete] => Array
                        (
                            [label] => Delete item
                            [href] => hauptseite/auswahl.html?act=delete&id=mm_test::6
                            [attribute] => onclick="if (!confirm('Do you really want to delete entry ID 6?')) return false;"
                            [class] => delete
                        )

                )

            [jumpTo] => Array
                (
                )

        )

    [1] => Array
        (
            [raw] => Array
                (
                    [id] => 8
                    [pid] => 0
                    [sorting] => 0
                    [tstamp] => 1560180479
                    [feld_proz] => Gruppe2
                    [feld_prozow] => Array
                        (
                            [__SELECT_RAW__] => Array
                                (
                                    [id] => 1
                                    [pid] => 0
                                    [sorting] => 0
                                    [tstamp] => 1560182231
                                    [compn] => UNSART
                                    [compdesc] =>
                                )

                            [compdesc] =>
                            [compn] => UNSART
                        )

                )

            [text] => Array
                (
                    [feld_proz] => Gruppe2
                    [feld_prozow] => UNSART
                )

            [attributes] => Array
                (
                    [feld_proz] => feld_proz
                    [feld_prozow] => feld_prozow
                )

            [html5] => Array
                (
                    [feld_proz] => <span class="text">Gruppe2</span>
                    [feld_prozow] => UNSART
                )

            [class] => odd
            [actions] => Array
                (
                    [edit] => Array
                        (
                            [label] => Edit item
                            [href] => hauptseite/auswahl.html?act=edit&id=mm_test::8
                            [class] => edit
                        )

                    [copy] => Array
                        (
                            [label] => Copy item
                            [href] => hauptseite/auswahl.html?act=copy&source=mm_test::8
                            [class] => copy
                        )

                    [delete] => Array
                        (
                            [label] => Delete item
                            [href] => hauptseite/auswahl.html?act=delete&id=mm_test::8
                            [attribute] => onclick="if (!confirm('Do you really want to delete entry ID 8?')) return false;"
                            [class] => delete
                        )

                )

            [jumpTo] => Array
                (
                )

        )

    [2] => Array
        (
            [raw] => Array
                (
                    [id] => 7
                    [pid] => 0
                    [sorting] => 0
                    [tstamp] => 1560180447
                    [feld_proz] => Gruppe3
                    [feld_prozow] => Array
                        (
                            [__SELECT_RAW__] => Array
                                (
                                    [id] => 2
                                    [pid] => 0
                                    [sorting] => 0
                                    [tstamp] => 1560182244
                                    [compn] => UNBFS
                                    [compdesc] =>
                                )

                            [compdesc] =>
                            [compn] => UNBFS
                        )

                )

            [text] => Array
                (
                    [feld_proz] => Gruppe3
                    [feld_prozow] => UNBFS
                )

            [attributes] => Array
                (
                    [feld_proz] => feld_proz
                    [feld_prozow] => feld_prozow
                )

            [html5] => Array
                (
                    [feld_proz] => <span class="text">Gruppe3</span>
                    [feld_prozow] => UNBFS
                )

            [class] => even
            [actions] => Array
                (
                    [edit] => Array
                        (
                            [label] => Edit item
                            [href] => hauptseite/auswahl.html?act=edit&id=mm_test::7
                            [class] => edit
                        )

                    [copy] => Array
                        (
                            [label] => Copy item
                            [href] => hauptseite/auswahl.html?act=copy&source=mm_test::7
                            [class] => copy
                        )

                    [delete] => Array
                        (
                            [label] => Delete item
                            [href] => hauptseite/auswahl.html?act=delete&id=mm_test::7
                            [attribute] => onclick="if (!confirm('Do you really want to delete entry ID 7?')) return false;"
                            [class] => delete
                        )

                )

            [jumpTo] => Array
                (
                )

        )

    [3] => Array
        (
            [raw] => Array
                (
                    [id] => 5
                    [pid] => 0
                    [sorting] => 0
                    [tstamp] => 1560179836
                    [feld_proz] => Gruppe4
                    [feld_prozow] => Array
                        (
                            [__SELECT_RAW__] => Array
                                (
                                    [id] => 1
                                    [pid] => 0
                                    [sorting] => 0
                                    [tstamp] => 1560182231
                                    [compn] => UNSART
                                    [compdesc] =>
                                )

                            [compdesc] =>
                            [compn] => UNSART
                        )

                )

            [text] => Array
                (
                    [feld_proz] => Gruppe4
                    [feld_prozow] => UNSART
                )

            [attributes] => Array
                (
                    [feld_proz] => feld_proz
                    [feld_prozow] => feld_prozow
                )

            [html5] => Array
                (
                    [feld_proz] => <span class="text">Gruppe4</span>
                    [feld_prozow] => UNSART
                )

            [class] => last odd
            [actions] => Array
                (
                    [edit] => Array
                        (
                            [label] => Edit item
                            [href] => hauptseite/auswahl.html?act=edit&id=mm_test::5
                            [class] => edit
                        )

                    [copy] => Array
                        (
                            [label] => Copy item
                            [href] => hauptseite/auswahl.html?act=copy&source=mm_test::5
                            [class] => copy
                        )

                    [delete] => Array
                        (
                            [label] => Delete item
                            [href] => hauptseite/auswahl.html?act=delete&id=mm_test::5
                            [attribute] => onclick="if (!confirm('Do you really want to delete entry ID 5?')) return false;"
                            [class] => delete
                        )

                )

            [jumpTo] => Array
                (
                )

        )

)
</pre>

 DEBUG ENDE -->

---

Hast du das gemeint?

Gruß
Alexander

das sieht mir eher wie die Ausgabe von $this->data als von $this->data[0] aus - bei letzterem sollte nur der 0.-Knoten ausgegeben werden

Hi zonky,

ich habe dies so eingefügt im Template:

PHP-Code:

---

 <thead>
    <tr>
     <?php foreach ($this->data[0] as $arrItem): ?> 
        <?php foreach ($arrItem['attributes'] as $field => $strName): ?>
            <?php if ((isset($arrItem[$this->getFormat()][$field]) && ($strValue = $arrItem[$this->getFormat()][$field])
                || (isset($arrItem['text'][$field]) && ($strValue = $arrItem['text'][$field])))): ?>
                <th class="item <?= $arrItem['class'] ?>" scope="col"><?= sprintf($GLOBALS['TL_LANG']['MSC']['field_label'], $strName) ?></th>
            <?php endif; ?>
        <?php endforeach; ?>
        <?php foreach($arrItem['actions'] as $action): ?>
            <th>
            <span>Aktion</span>
            </th>
        <?php endforeach; ?>
    <?php endforeach; ?>
    </tr>
  </thead>

---

Das, was ich per Debug im Quelltext der Seite bekomme, ist das, was ich oben gepostet habe. Packe ich das

PHP-Code:

---

 <?php foreach ($this->data[0] as $arrItem): ?>

---

an die falsche Stelle?

Ansonsten zeigt er im Frontend keine Tabellenüberschriften mehr an.

Gruß
Alexander

PHP-Code:

---

<thead>
    <tr>
     <?php $arrItem = $this->data[0]; ?> 
        <?php foreach ($arrItem['attributes'] as $field => $strName): ?>
            <?php if ((isset($arrItem[$this->getFormat()][$field]) && ($strValue = $arrItem[$this->getFormat()][$field])
                || (isset($arrItem['text'][$field]) && ($strValue = $arrItem['text'][$field])))): ?>
                <th class="item <?= $arrItem['class'] ?>" scope="col"><?= sprintf($GLOBALS['TL_LANG']['MSC']['field_label'], $strName) ?></th>
            <?php endif; ?>
        <?php endforeach; ?>
        <?php foreach($arrItem['actions'] as $action): ?>
            <th>
            <span>Aktion</span>
            </th>
        <?php endforeach; ?>
    </tr>
  </thead>

---

?

Works!
Vielen Dank, zonky.

Kannst du mir erklären, was dieser kleine, aber feine Unterschied bewirkt hat?

Gruß
Alexander

dump dir mal $this->data und $this->data[0] - dann sollte das klar werden