Ergebnis 1 bis 5 von 5

Thema: Spalten in einer Tabelle optional ausgeben bzw. auswählbar?

  1. #1
    Contao-Nutzer
    Registriert seit
    24.06.2009.
    Beiträge
    165

    Standard Spalten in einer Tabelle optional ausgeben bzw. auswählbar?

    Hallo,

    ich bastle mit Catalog gerade eine Tabelle mit zahlreichen Vergleichsmöglichkeiten = Spalten = Kriterien für mehrere Produkten.

    Nun hätte ich gerne, dass der User auf der Website per Checkboxen die anzuzeigenden Spalten = "Vergleichs-Kriterien" in einer Vergleichstabelle selbst auswählen kann und dann die Tabelle mit zuvor den entsprechend gewählten Spalten neu ausgegeben wird. So kann er dann nach seinen Präferenzen die für ihn 5-6 wichtigsten Kriterien gegenüberstellen statt in einer für ihn überdimensionierten Tabelle herumzusuchen. Die Tabelle soll per Default immer ca. 7 Spalten vorhalten, 2 davon sind fix (die ersten beiden = Produkt und Position), die anderen 5 soll der User nach Belieben auswählen und generieren können.

    D.h. in der Datenbank soll die per Catalog angelegte "Tabelle" viel mehr befüllte Spalten vorhalten, aber aus Platzgründen bei einem statischen Layout nur ein paar davon = nämlich die vom User ausgewählten Kriterien im Frontend als Tabelle ausgeben!

    Grund ist, dass im Wrapper (bei 1spaltigem Layout) der Website in der Breite ja nur ein gewisser Platz für die Catalog-Tabelle möglich ist und so nicht mehr Spalten ausgegeben werden können als es z.B. für 940 px (minus je 10px margin zum rand) reicht.

    Der User soll aber nach seinen Präferenzen aus Checkboxen (am besten direkt oberhalb der Tabelle) selbst auswählen können, welche Spalten samt Inhalten angezeigt werden sollen.

    Ich hoffe ich hab mich einigermaßen klar ausgedrückt

    Läßt sich sowas mit der Erweiterung Catalog realisieren oder ist da einiges an Umprogrammierung oder gar ein komplett neues Modul notwendig?


    Edit: bin auch für alternative Lösungsvorschläge offen z.B. "versteckte" Spalten in den sichtbaren Bereich zu sliden o.ä. aber das scheint mir mindestens ähnlich komplex wie das andere....

    Edit2: Ich weiß dass man im Catalog Filter = Checkboxen benutzen kann, dies ist aber was anderes als die von mir angestrebte Manipulation der angezeigten Spalten oder?
    Geändert von murphyslaw (22.06.2011 um 22:10 Uhr)

  2. #2
    Contao-Urgestein Avatar von Tim G
    Registriert seit
    13.02.2010.
    Ort
    Lübeck
    Beiträge
    2.210
    User beschenken
    Wunschliste

    Standard

    Hi,
    sicher ist, mit Filtern gehts nicht, aber mit Template-Anpassung.

    Ich nehme an, da du Tabellen benutzt, du benutzt eines der catalog templates, das Tabellen ausgibt - also nicht von vornherein an ganz eigenes Template.
    Wie du bereits als Ansatz hattest es mit Checkboxes (z.B. über der Spalte) zu realisieren, wäre auch mein Ansatz.
    Im Template wird innerhalb der foreach Schleife sämtliche Spalten gebildet (abhängig deiner sichtbaren Felder).
    Du könntest jetzt das Template anpassen, das noch vor der ersten Spalte eine Checkbox mit einer indexierten Klasse ausgegben wird. sowas wie class="checkbox_ <?php echo $myCounter++; ?>"
    Dann hättest du schonmal passende checkboxes zu den Spalten, die auch eine Nummer bekommen.

    Dann kommt bissel javascript zum Einsatz. Mit mootools ist das sehr gut machbar.
    Dort einfach gucken welche checkbox geklickt wurde, und per indexOf die passende Spalte entweder sichtbar, oder unsichtbar schalten.

    Sollte klappen. bzw. fällt mir grad nichts anderes / leichteres / schnelleres ein.

    Grüße Tim
    http://www.tim-gatzky.de ˙ auch schon wieder 2 Jahre alt - wie die Zeit vergeht... muss mal umbauen.

  3. #3
    Contao-Urgestein Avatar von Tim G
    Registriert seit
    13.02.2010.
    Ort
    Lübeck
    Beiträge
    2.210
    User beschenken
    Wunschliste

    Standard

    Es ist doch etwas mehr tricky.
    Mit Auszählen kommt man nicht all zu weit, da man innerhalb des Spalten-Arrays nicht weiss welcher Index (welche Spalten) zu welcher Checkbox gehören.
    Der Einträge-Array-pro-Spalte ist (je nach Anzahl der Einträge) n-lang, aber Checkboxes gibt es nur so viele wie Tabellen-Spalten. Daher kann man nicht sagen "checkbox #2", blende Spalte 2 aus -> dann würde er nur den ersten Eintrag ausblenden, aber die zweite Zeile ignorieren, weil dort der index bereits weiter ist.

    Long story short...
    man geht über die Klassennamen, die eh vergeben werden pro Feld und schaut welchen Klassennamen hat die aktuell geklickte checkbox.
    Damit sucht man sich aus dem Haufen Spalten diejenigen, die ebenfalls diesen Namen haben und blendet sie aus / bzw. ein.

    Ich hängs dir mal an, da kannst du bissel gucken wie es gehen könnte. Viele Wege führen nach Rom

    PHP-Code:
    <?php if (count($this->entries)): ?>

    <table class="layout_simpletable" summary="Catalog Items" cellspacing="0" cellpadding="0">
    <thead class="header">

    <!-- chechboxes -->
    <tr class="checkbox_container">
    <?php list($field$heading) = each($this->entries); ?>
    <?php 
    foreach ($heading['data'] as $field=>$data): ?>
    <?php 
    if (!in_array($field, array('catalog_name','parentJumpTo'))): ?>
    <th class="field <?php echo $field?>"><input type="checkbox" checked="checked" class="checkbox <?php echo $field?>"><?php echo $data['label']; ?></input></th>
    <?php endif; ?>
    <?php 
    endforeach; ?>
    </tr>

    <tr class="label_container">
    <?php list($field$heading) = each($this->entries); ?>
    <?php 
    foreach ($heading['data'] as $field=>$data): ?>
    <?php 
    if (!in_array($field, array('catalog_name','parentJumpTo'))): ?>
    <th class="field <?php echo $field?>"><?php echo $data['label']; ?></th>
    <?php endif; ?>
    <?php 
    endforeach; ?>
    </tr>

    </thead>
    <tbody class="body<?php echo $entry['class'] ? ' '.$entry['class'] : ''?>">
    <?php foreach ($this->entries as $entry): ?>
    <tr class="item<?php echo $entry['class'] ? ' '.$entry['class'] : ''?>">
    <?php foreach ($entry['data'] as $field=>$data): ?>
    <?php 
    if (!in_array($field, array('catalog_name','parentJumpTo'))): ?>
        <td class="field <?php echo $field?>"><?php if (strlen($data['value'])): ?>
    <?php 
    echo $data['value']; ?>

    <?php endif; ?>
    </td>
    <?php endif; ?>
    <?php 
    endforeach; ?>
    <?php 
    if ($entry['showLink'] && $entry['link']):  ?>
    <td class="link"><div class="link"><?php echo $entry['link']; ?></div></td>
    <?php endif; ?>
    <?php 
    if ($entry['linkEdit']): ?>
    <td class="edit"><div class="linkEdit"><?php echo $entry['linkEdit']; ?></div></td>
    <?php endif; ?>
    </tr>
    <?php endforeach; ?>
    </tbody>
    </table>

    <?php else: ?>

    <?php if ($this->condition): ?>
    <div class="condition"><?php echo $this->condition?></div>
    <?php else: ?>
    <p class="info">There are no entries matching your search.</p>
    <?php endif; ?>

    <?php endif; ?>




    <script type="text/javascript">
    <!--//--><![CDATA[//><!-- 

    /**
     * Blende Spalten aus, wenn Chechbox NICHT gedrueckt ist
     */
    window.addEvent('domready', function() 
    {
        var cols = $$('.mod_cataloglist .layout_simpletable tbody td');
        var checkboxes = $$('.mod_cataloglist .checkbox_container input');
        var colClasses = cols.get('class'); // store class names in an array
        
        var isChecked;
        var index;
        var boxClass;
        var thisCols = Array(); // store cols to hide / show
                
        // hide unchecked cols on page load
        checkboxes.each(function(item, index)
        {
            if (!item.get('checked'))
            {
                boxClass = item.get('class').replace('checkbox ', '');
                colClasses.each(function(item, index)
                {
                    if (item.search(boxClass) != -1) thisCols.push(cols[index]);
                });
                
                
            }
        });
        
        thisCols.each(function(item, index)
        {
            //item.setStyles({display:'none'});
            item.fade('hide');
        });

        // Eventlistener
        checkboxes.addEvents({
            'click' : function()
            {
                index = checkboxes.indexOf(this);
                isChecked = this.get('checked'); // check if checkbox is selected / not
                boxClass = this.get('class').replace('checkbox ', ''); // strip down the class name to its single fieldname
                thisCols = Array();
                
                // loop through cols Array and find the cols containing the boxClass
                colClasses.each(function(item, index)
                {
                    if (item.search(boxClass) != -1) thisCols.push(cols[index]);
                });
                            
                if(isChecked)
                {
                    thisCols.each(function(item, index)
                    {
                        //item.setStyles({display:'block'});
                        item.fade('in');
                    });
                }
                else
                {
                    thisCols.each(function(item, index)
                    {
                        //item.setStyles({display:'none'});
                        item.fade('out');
                    });
                }
            }
        });
    });


    //--><!]]>
    </script>

    Oben erstelle ich ein paar Checkboxes über dem table heads, die gleich gecheckt sind -> weil der user ja erstmal alles sehen soll
    Die checkboxes kriegen als Klassennamen: checkbox <?php echo $field; ?>
    => checkbox meinFelderName

    Unten kommt dann der javascript block, der genau das macht wie oben erklärt.

    Theoretisch kannst du die Checkboxes überall platzieren. solange sie innerhalb der .mod_cataloglist klasse bleiben und als wrapper .checkbox_container kriegen. (das sind meine selectors für mootools) (kann man auch alles ändern. musst dann halt nur anpassen)

    Viele Grüße,
    Tim

    ps. habs grad noch getuned:
    Die ausgeblendeten Spalten sollten beim Seiten-Reload gleich ausgeblendet werden.
    Und noch bissel fancy stuff rein, mit dem fade(); kannst du die Spalten schön smooth ausblenden lassen.
    Falls du das nicht willst, einfach im mootools Teil die auskommentierten Teile mit dem setStyles nehmen und die fades dafür auskommentieren.
    Geändert von Tim G (23.06.2011 um 09:14 Uhr)
    http://www.tim-gatzky.de ˙ auch schon wieder 2 Jahre alt - wie die Zeit vergeht... muss mal umbauen.

  4. #4
    Contao-Nutzer
    Registriert seit
    24.06.2009.
    Beiträge
    165

    Daumen hoch

    Hi Tim G

    herzlichen Dank für die viele Mühe, die Du dir gemacht hast! Ich war gestern wegen Feiertag offline, werde mir gleich alles anschauen!

    Ich denke man sollte diese Funktionalität auf jedenfall fest in künftige Catalog-Updates einbauen, da die optionale Anzeige von Spalten via Checkboxen sicher für sehr viele Zwecke interessant ist und somit noch mehr Möglichkeiten mit Catalog geschaffen werden können.

    Catalog ist ohnehin eines der variabelsten Extensions neben dem erweiterten Formeleditor EFG :thumbup:.

  5. #5
    Contao-Urgestein Avatar von Tim G
    Registriert seit
    13.02.2010.
    Ort
    Lübeck
    Beiträge
    2.210
    User beschenken
    Wunschliste

    Standard

    Schön wenns so passt.

    Ich denke man sollte diese Funktionalität auf jedenfall fest in künftige Catalog-Updates einbauen, da die optionale Anzeige von Spalten via Checkboxen sicher für sehr viele Zwecke interessant ist und somit noch mehr Möglichkeiten mit Catalog geschaffen werden können.
    - ich denke via template reicht das völlig. Sonst müsste eine php-Variante her und da sehe ich andere Dinge, die eine höhere Priorität haben.

    - vielleicht ein Sammelsurium an Templates mal starten. Sind ja hier doch so einige in Threads versteckt, die immer wiederkehrende Fragen beantworten würden.
    Wäre auch im Wiki gut aufgehoben.
    (jaja, ich weiss. ich sollte selbst damit anfangen)

    Grüße,
    Tim
    http://www.tim-gatzky.de ˙ auch schon wieder 2 Jahre alt - wie die Zeit vergeht... muss mal umbauen.

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •