Profil | Mitglieder | Registrieren | Start | Suche


PHP-Support.de » Programmierung » HTML, JavaScript & CSS » Uploadprogress - Erfolgsmeldung wenn fertig    » Hallo Gast [Login | Registrieren]

Neues Thema | Antworten   

Autor Beitrag
chris
Mitglied
Guter User


Dabei seit: 27.07.2009
Herkunft: Bayern
Posts: 253
     Uploadprogress - Erfolgsmeldung wenn fertig Zitat | Bearbeiten

Hi Leute,

ich habe folgenden JavaScript-Code im Internet gefunden, mit dem ein Prozess-Fortschritt beim Upload angezeigt wird, was auch sehr gut klappt. Jedoch wird mir beim fertigstellen keine Meldung ausgegeben. Der Prozessbalken wandert halt bis 100% und gut. Ich würde da aber gerne noch eine Meldung einbauen "Upload fertig".

Leider habe ich mich mit JavaScript noch nie befasst, was die Sache etwas schwierig macht für mich. Hat da jemand eine Idee, wie man das bewerkstelligen könnte?

Hier der entsprechende Codeabschnitt:

 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
<script type="text/javascript">

function fileChange()
{
    //FileList Objekt aus dem Input Element mit der ID "fileA"
    var fileList = document.getElementById("fileA").files;

    //File Objekt (erstes Element der FileList)
    var file = fileList[0];

    //File Objekt nicht vorhanden = keine Datei ausgewählt oder vom Browser nicht unterstützt
    if(!file)
        return;

    document.getElementById("fileName").innerHTML = 'Dateiname: ' + file.name;
    document.getElementById("fileSize").innerHTML = 'Dateigröße: ' + file.size + ' B';
    document.getElementById("fileType").innerHTML = 'Dateitype: ' + file.type;
    document.getElementById("progress").value = 0;
    document.getElementById("prozent").innerHTML = "0%";
}

var client = null;

function uploadFile()
{
    //Wieder unser File Objekt
    var file = document.getElementById("fileA").files[0];
    //FormData Objekt erzeugen
    var formData = new FormData();
    //XMLHttpRequest Objekt erzeugen
       client = new XMLHttpRequest();

    var prog = document.getElementById("progress");

    if(!file)
        return;

    prog.value = 0;
    prog.max = 100;

    //Fügt dem formData Objekt unser File Objekt hinzu
    formData.append("datei", file);

    client.onerror = function(e) {
        alert("onError");
    };

    client.onload = function(e) {
        document.getElementById("prozent").innerHTML = "100%";
        prog.value = prog.max;
    };

    client.upload.onprogress = function(e) {
        var p = Math.round(100 / e.total * e.loaded);
        document.getElementById("progress").value = p;
        document.getElementById("prozent").innerHTML = p + "%";
    };

    client.onabort = function(e) {
        alert("Upload abgebrochen");
    };

    client.open("POST", "ul.php");
    client.send(formData);
}

function uploadAbort() {
    if(client instanceof XMLHttpRequest)
        client.abort();
}
</script>


Gruß Chris


"Die Wahrheit wird oft verdunkelt, doch sie erlischt nie"

Livius

Post wurde schon 1x editiert, das letzte mal am 16.03.2016 um 15:07 von chris
16.03.2016, 15:07 Profil | PM | Homepage | E-Mail  
Andavos
Administrator
Foren-Gott


Dabei seit: 30.11.2003
Herkunft:
Posts: 6186
      Zitat | Bearbeiten

Hi,
du müsstest die client.upload.onprogress anpassen:
 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:

client.upload.onprogress = function(e) {
        if(e.total == e.loaded) {
              alert('Upload fertig');
        }
        var p = Math.round(100 / e.total * e.loaded);
        document.getElementById("progress").value = p;
        document.getElementById("prozent").innerHTML = p + "%";
    }; 



www.php-einfach.de, PHP lernen leicht gemacht
www.webhosterwissen.de, Webhosting-Vergleich



16.03.2016, 17:20 Profil | PM | E-Mail  
chris
Mitglied
Guter User


Dabei seit: 27.07.2009
Herkunft: Bayern
Posts: 253
      Zitat | Bearbeiten

Perfekt, danke


"Die Wahrheit wird oft verdunkelt, doch sie erlischt nie"

Livius
16.03.2016, 18:20 Profil | PM | Homepage | E-Mail  
Seiten (1):  1 
PHP-Support.de » Programmierung » HTML, JavaScript & CSS » Uploadprogress - Erfolgsmeldung wenn fertig   

Neues Thema | Antworten   


Powered by Command Board 1.0 - Beta 2.0 © 2004-08 PHP-Einfach | Impressum | Datenschutz