Contao-Camp 2024
Ergebnis 1 bis 3 von 3

Thema: List -> Gallery (fileTree) Sortierung

  1. #1
    Contao-Nutzer Avatar von xava
    Registriert seit
    13.06.2012.
    Beiträge
    22

    Standard List -> Gallery (fileTree) Sortierung

    Hallo zusammen,

    ich habe eine kleine Verständnisfrage zu der Kombination List und Sortierung von Dateien.

    Wenn ich es richtig verstanden habe, ist es nicht möglich die Sortierung aus dem Backend zu sichern, und auch nicht manuell durch einen Kniff zu speichern, so dass der User diese im Backend für das Frontend nicht angeben kann. Ist das immer noch so der Stand der Dinge?

    vielen Dank
    Gruß Xava

    PHP-Code:
    'inputType' => 'list' 
    PHP-Code:
    'gallery' => array(
        
    'label' => array(
            
    'de' => array('Galerie'''),
        ),
        
    'inputType' => 'fileTree',
        
    'eval' => array(
            
    'fieldType' => 'checkbox',
            
    'isGallery' => true,
            
    'multiple' => true,
            
    'filesOnly' => true,
            
    'extensions' => 'jpg,jpeg,png,gif,svg',
            
    'orderField' => 'orderSrc',
        ),

    Geändert von xava (12.07.2018 um 18:44 Uhr)

  2. #2
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    33.803
    Partner-ID
    10107

    Standard

    Einfach kein orderField setzen

  3. #3
    Contao-Nutzer
    Registriert seit
    15.03.2010.
    Ort
    AT
    Beiträge
    204

    Standard Rocksolid Custom Elements Bilder (fileTree) sortieren

    Ich hab nun das Problem selbst mit Javascript gelöst.
    Falls es Probleme gibt Bescheid geben.

    In einem eigenen Modul in der config.php folgendes Script hinzufügen.
    PHP-Code:
     /**
        * Add this in config.php in your custom module or in dcaconfig.php
        * To sort images with rock solid custom elements inside 'inputType' => 'list'
        *
        */
        
    if (TL_MODE == 'BE')
        {
            if (\
    Contao\Input::get('act') == 'edit' && \Contao\Input::get('do') == 'article' && \Contao\Input::get('id'))
            {
                
    $GLOBALS['TL_MOOTOOLS'][] = "<script>

                document.body.addEventListener('DOMSubtreeModified', function(event) {
                    var elements = document.getElementsByClassName('rsceSortableCustom');

                    Object.keys(elements).map(function(objectKey, index) {
                        var obj = elements[objectKey];
                        obj.addEventListener('mouseup', function(){
                            newOrder = getListOrder(obj);
                            updateInputValue(obj, newOrder);
                        });    
                    });

                    function getListOrder(obj) {
                        var inputValue = [];
                        var list = obj.querySelectorAll('.sgallery li');

                        list.forEach(function (el, index) {
                            if (el.getAttribute('data-id') != null) {
                                inputValue.push(el.getAttribute('data-id'))
                            }
                        });
                        return inputValue.join(',');
                    }

                    function updateInputValue(obj, newOrder) {
                        var input = ( obj.getElementsByTagName('input') );
                        input[0].value = newOrder;
                    }
                    });

                </script>"
    ;

            }
        } 
    Im RS Custom Element (rsce_irgenwas_config.html5) danach die CSS Klasse hinzufügen:

    PHP-Code:
    // INSIDE 'inputType' => 'list'
    // ......
    'image' => array(
        
    'label' => array(
            
    'de' => array('Bilder''Wählen Sie ein oder mehrere Bilder aus.')
        ),
        
    'inputType' => 'fileTree',
        
    'eval' => array(
            
    'multiple' => true,
            
    'fieldType' => 'checkbox',
            
    'filesOnly' => true,
            
    'extensions' => 'jpg,jpeg,png,gif,svg',
            
    'mandatory'=>false,
            
    'orderField' => 'orderSRC'/* MUST be set*/
            
    'tl_class' => 'w50 rsceSortableCustom',  /* custom css class for javascript */
            
    'files'=>true,
            
    'isGallery' => true
        )                    
    ),
    //...... 
    Das Script ändert die Bild-Reihenfolge im input Feld wenn die Reichenfolge der Liste geändert wird.

    lg
    Geändert von heyho (04.07.2019 um 10:41 Uhr)

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
  •