Contao-Camp 2024
Ergebnis 1 bis 2 von 2

Thema: [solved] valumsFileUploader wird im FE nicht angezeigt

  1. #1
    Contao-Nutzer
    Registriert seit
    04.01.2013.
    Ort
    Leipzig
    Beiträge
    2

    Standard [solved] valumsFileUploader wird im FE nicht angezeigt

    Hallo!

    Ich habe ein Formular erstellt, das nur den vFU enthält. Im Backend wird der vFU angezeigt:
    Screenshot1.png

    Im Frontend ist er dagegen "unsichtbar", lediglich der "Senden"-Button wird angezeigt:
    Screenshot2.png

    Der Code im FE sieht folgendermaßen aus:

    Code:
    <article class="mod_article block" id="bewerbungsformular">
    <h2>Bewerbungsformular</h2>
    
    <!-- indexer::stop -->
    <div class="ce_form tableform block">
    
    <form action="de/unternehmen/karriere/bewerbungsformular" id="f56" method="post" enctype="multipart/form-data">
    <div class="formbody">
    <input type="hidden" name="FORM_SUBMIT" value="auto_form_56">
    <input type="hidden" name="REQUEST_TOKEN" value="f0a4e45ee4bfd9ef5fad19ebc748d1ed">
    <input type="hidden" name="MAX_FILE_SIZE" value="10485760">
    <table>
        <tbody><tr class="row_0 row_first even">
            <td class="col_0 col_first">
                            <div id="file-uploader-658" class=" block">
                    <noscript>          
                        &lt;div&gt;&lt;input type="file" name="neue_Dateien" id="ctrl_658" class="upload" /&gt;&lt;/div&gt;
                    </noscript>         
                </div>
    
                             <input type="submit" id="ctrl_658_submit" class="submit" value="Senden">        </td>
            <td class="col_1 col_last"></td>
        </tr>
        
    <script type="text/javascript">    
    function createUploader(vfu){
        var uploader = new qq.FileUploader({
            element: document.getElementById('file-uploader-658'),            
            action: 'ajax.php',            
            params: {action: 'ffl', id: '658', type:'valumsFileUploader'},
            allowedExtensions: ['jpg', 'jpeg', 'gif', 'png', 'pdf', 'doc', 'xls', 'ppt'],                    
            debug: false,            
            sizeLimit: "",            
            template: '<div class="qq-uploader">' + 
                '<div class="qq-upload-drop-area"><span>Zum Hochladen die Datei in dieses Feld ziehen<\/span><\/div>' +
                '<div class="qq-upload-button">Datei hochladen<\/div>' +
                '<ul class="qq-upload-list"><\/ul>' + 
                '<\/div>',
            fileTemplate: '<li>' +
                            '<span class="qq-upload-file"><\/span>' +
                '<span class="qq-upload-spinner"><\/span>' +
                '<span class="qq-upload-size"><\/span>' +
                '<a class="qq-upload-cancel" href="#">Abbrechen<\/a>' +
                '<span class="qq-upload-text"><\/span>' +
                '<\/li>',
            messages: {
                typeError: "{file} ist ein nicht erlaubter Dateityp. Nur die Dateitypen {extensions} sind erlaubt.",
                sizeError: "{file} ist zu groß, die maximal erlaubte Dateigröße ist {sizeLimit}.",
                minSizeError: "{file} ist zu klein, die minimal erlaubte Dateigröße ist {minSizeLimit}.",
                emptyError: "{file} ist leer, bitte wählen Sie diese Datei nicht mehr aus.",
                onLeave: "Die Daten werden hochgeladen, wenn Sie die Seite jetzt verlassen wird der Prozess abgebrochen."          
            },
            onComplete: function(id, fileName, responseJSON){
                vfu.setId(id);
                vfu.setfileName(fileName);
                vfu.setResponseJSON(responseJSON);                
                vfu.run(id, fileName, responseJSON);
            }
        });
    }
    window.addEvent('domready', function(){    
        var vfu = new ValumsFileUploader({
            'action' : 'ajax.php',
            'actionParam' : 'ffl',
            'fflId' : '658',
            'fflIdName' : 'file-uploader-658',
            'failureMassage' : 'Fehlgeschlagen',
            'detailsFailureMessage' : false,
            'allowDelete' : false,
            'reloadList' : $('vfu_reload')
        });
        createUploader(vfu);
        });
    </script></tbody></table>
    </div>
    </form>
    
    </div>
    <!-- indexer::continue -->
    
    </article>
    Das Problem tritt sowohl im Firefox als auch im Chrome/Chromium auf.

    Ich vermute ein CSS-Problem oder einen Konflikt mit einem anderen Plugin. Ich finde aber keine konkreten Hinweise, woran es liegen könnte.

    Weiß jemand Rat?
    Geändert von ric_ (04.01.2013 um 12:55 Uhr)

  2. #2
    Contao-Nutzer
    Registriert seit
    04.01.2013.
    Ort
    Leipzig
    Beiträge
    2

    Standard

    Ich habe den Fehler gefunden:

    In dem der Seite zugewiesenen Layout war MooTools nicht aktiviert, daher hat der Code einen Fehler produziert.
    Im BE ist MooTools aktiviert.

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
  •