Guten Tag liebe community,
ich habe wie viele mir nen uploader im internet gesucht und hab deshalb kaum ahnung was da jetzt passiert und wie genau da jetzt die sachen an die Upload.php geschickt werden. Deshalb hab ich auch ein problem:
undzwar möchte ich das wenn man ein Bild aussucht der eine Combobox darstellt und der user dort eine Kategorie aussucht. Soweit so gut, das klappt alles, aber wie übergebe ich nun den wert der in der Combobox ist auch noch an die upload.php, wo dann auch der eintrag in die Datenbank gemacht wird um die Datei in der Webseite anzuzeigen.
Die Uploader.html:
Ich weiß aufjedenfall das hiermit...
Die Daten an die upload.php gesendet werden, aber wie geb ich jetzt noch die Werte von der Combobox weiter?
Ich hoffe ihr könnt mir helfen.
MfG
IceFight
ich habe wie viele mir nen uploader im internet gesucht und hab deshalb kaum ahnung was da jetzt passiert und wie genau da jetzt die sachen an die Upload.php geschickt werden. Deshalb hab ich auch ein problem:
undzwar möchte ich das wenn man ein Bild aussucht der eine Combobox darstellt und der user dort eine Kategorie aussucht. Soweit so gut, das klappt alles, aber wie übergebe ich nun den wert der in der Combobox ist auch noch an die upload.php, wo dann auch der eintrag in die Datenbank gemacht wird um die Datei in der Webseite anzuzeigen.
Die Uploader.html:
PHP-Code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>File-Upload mit Fortschrittanzeige</title>
</head>
<body>
<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("inputfn").value = file.name;
document.getElementById("fileSize").innerHTML = '<b>Filesize:</b> ' + Math.round(file.size / 1024) + ' KB';
document.getElementById("fileType").innerHTML = '<b>Filetype:</b> ' + file.type;
document.getElementById("prozent").style.width = "0%";
document.getElementById("filebtn").innerHTML = "<input name='upload' value='Upload' style='float: right; height: 30px; line-height: 30px;' id='btn' type='button' onclick='uploadFile();' />";
document.getElementById("uploadcompleted").innerHTML = "";
}
var client = null;
function uploadFile()
{
document.getElementById("filebtn").innerHTML = "";
//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) {
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").style.width = p + "%";
};
client.open("POST", "/upload.php");
client.onreadystatechange = function() {
if(this.readyState == this.DONE && this.status == 200)
{
var ausgabe = document.getElementById("uploadcompleted");
ausgabe.innerHTML = this.responseText;
}
};
client.send(formData);
}
</script>
<div id='fileupload'>
<h2 style='text-align: center;'>Picture Uploader</h2>
<form action="" method="post" enctype="multipart/form-data">
<input style='margin-right: 5px;' type='text' id='inputfn' size="68" disabled>
<label class="fileContainer">
<span>Choose a file</span>
<input name="file" class="upload" type="file" class="fileA" id="fileA" onchange="fileChange();"/>
</label>
<div id="fileName"></div>
<div id="fileSize"></div>
<div id="fileType"></div>
<div class="progress" id="progress">
<span style="width: 100%" id="prozent"></span>
</div>
<br> <div id="uploadcompleted" style="float: left; color: green; line-height: 30px;"> </div>
<div id='filebtn'></div>
<br style="clear:both;">
</form>
</div>
</body>
</html>
PHP-Code:
client.open("POST", "/upload.php");
client.send(formData);
Ich hoffe ihr könnt mir helfen.
MfG
IceFight