Multi-Upload Formular Link ausgeben

kkapsner schrieb:
Das kann ich dir leider nicht sagen, da ich den Code, wo du den fileupload initialisierst nicht kenne.

Da müsste irgendwo
Code: 
$("irgendein Selektor").fileupload({/*eventuelle Parameter*/});
stehen - da kannst du direkt dahinter das .bind() packen.
Zum Vergrößern anklicken....

Zwei in Frage kommende Stellen habe ich jetzt gefunden:

1.
Code: 
            // The add callback is invoked as soon as files are added to the fileupload
            // widget (via file input selection, drag & drop, paste or add API call).
            // If the singleFileUploads option is enabled, this callback will be
            // called once for each file in the selection for XHR file uplaods, else
            // once for each file selection.
            // The upload starts when the submit method is invoked on the data parameter.
            // The data object contains a files property holding the added files
            // and allows to override plugin options as well as define ajax settings.
            // Listeners for this callback can also be bound the following way:
            // .bind('fileuploadadd', func);
            // data.submit() returns a Promise object and allows to attach additional
            // handlers using jQuery's Deferred callbacks:
            // data.submit().done(func).fail(func).always(func);
            add: function (e, data) {
                if (data.autoUpload || (data.autoUpload !== false &&
                        ($(this).data('blueimp-fileupload') ||
                        $(this).data('fileupload')).options.autoUpload)) {
                    data.submit();
                }
            },

2.
Code: 
            if (xhr.upload) {
                $(xhr.upload).bind('progress', function (e) {
                    var oe = e.originalEvent;
                    // Make sure the progress event properties get copied over:
                    e.lengthComputable = oe.lengthComputable;
                    e.loaded = oe.loaded;
                    e.total = oe.total;
                    that._onProgress(e, options);
                });
                options.xhr = function () {
                    return xhr;
                };
 
Ich glaube, du suchst in den falschen Dateien - das muss irgendwo in deinem eigenen JS stehen und nicht in dem vom Plugin. In dem Beispiel oben ist die betreffende Stelle in der script.js
 
kkapsner schrieb:
Ich glaube, du suchst in den falschen Dateien - das muss irgendwo in deinem eigenen JS stehen und nicht in dem vom Plugin.
Zum Vergrößern anklicken....

Ahhh... Danke für den Tipp! Die betreffende Stelle müsste dann die hier sein:
Code: 
    $('#upload').fileupload({

        // This element will accept file drag/drop uploading
        dropZone: $('#drop'),

        // This function is called when a file is added to the queue;
        // either via the browse button, or via drag/drop:
        add: function (e, data) {

            var tpl = $('<li class="working"><input type="text" value="0" data-width="48" data-height="48"'+
                ' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><span></span></li>');

            // Append the file name and file size
            tpl.find('p').text(data.files[0].name)
                         .append('<i>' + formatFileSize(data.files[0].size) + '</i>');

            // Add the HTML to the UL element
            data.context = tpl.appendTo(ul);

            // Initialize the knob plugin
            tpl.find('input').knob();

            // Listen for clicks on the cancel icon
            tpl.find('span').click(function(){

                if(tpl.hasClass('working')){
                    jqXHR.abort();
                }

                tpl.fadeOut(function(){
                    tpl.remove();
                });

            });

            // Automatically upload the file once it is added to the queue
            var jqXHR = data.submit();
        },

        progress: function(e, data){

            var progress = parseInt(data.loaded / data.total * 100, 10);

      data.context.find('input').val(progress).change();

            if(progress == 100){
                data.context.removeClass('working');
            }
        },

        fail:function(e, data){
            // Something has gone wrong!
            data.context.addClass('error');
		       alert("Upload fehlgeschlagen!\n\nEs ist ein Fehler während des Uploads aufgetreten.");
        }

    });


Wie füge ich nun die JSON-Ausgabe hinzu?
 
OK - mach' doch mal in das options-Objekt einen Schlüssel "done":
Code: 
	done: function(data){
		console.log(data);
	}
und schau' dir an, ob im data-Objekt deine Nachricht drin ist.
 
kkapsner schrieb:
schau' dir an, ob im data-Objekt deine Nachricht drin ist.
Zum Vergrößern anklicken....

Ja, müsste sie schon: multi_upload_json.jpg


Ich hab das jetzt folgendermaßen eingebunden:
Code: 
//...
progress: function(e, data){

// Calculate the completion percentage of the upload
var progress = parseInt(data.loaded / data.total * 100, 10);

// Update the hidden input field and trigger a change
// so that the jQuery knob plugin knows to update the dial
data.context.find('input').val(progress).change();

if(progress == 100){
   data.context.removeClass('working');
}
},

done: function(e, data){
         console.log(data);
},

fail:function(e, data){
     // Something has gone wrong!
     data.context.addClass('error');
}
//...
 
Zuletzt bearbeitet:
Sehr gut. data.result kannst du jetzt an JSON.parse() übergeben und du hast deine Nachricht im JS. Dann kannst du sie ja irgendwo anzeigen lassen.
 
Also, ich hab's mir gerade noch mal angeschaut: funktioniert perfekt!
Danke euch für euere Geduld; und schön, dass wir nun auf die im Grund doch relativ simple Lösung gekommen sind :)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben