Xin hat geschrieben:
Schick ihm doch mal den Link zu dem Thread, vielleicht erweitert er das
AJAX-Tutorial entsprechend, sofern Dir die vorhanden Informationen nicht reichen.
Wie finde ich das ohne über den direkten Link in Deinem Post? In der Doku ist hierzu kein Link zu finden und stecken da noch mehr interessante aber versteckte Artikel?
Dubbel hat geschrieben:Ich hab sowas bisher noch nicht implementiert, vielleicht hat C@mper schon eine Lösung auf Lager?
Ich habe da mal ein kleines Beispiel zusammengestellt:
Für einen Upload öffne ich ein kleines zusätzliches Browserfenster. (Nicht notwendig, aber ich fand's immer ganz nett)
Code: Alles auswählen
<input class='button_small' type='button' value='Update' name='' onclick=\"javascript:UpdatePic();\">
Das dazu gehörende JS:
Code: Alles auswählen
function UpdatePic()
{
window.open('fileupload.php', '_blank', 'dependent=no, resizable=no, left=80, width=600, height=20');
} // UpdateDriverPic()
Das fileupload.php sieht dann so aus:
Code: Alles auswählen
<?php
//---------------------------------------------------------------------------
//- Name : fileupload.php -
//- Descript : HTML Formular und Filetransfer Routine fuer Dateiupload -
//- created : 10.08.2009 - B. -
//- change : -
//---------------------------------------------------------------------------
if (is_uploaded_file($_FILES['file']['tmp_name'])) // Wurde wirklich eine Datei hochgeladen?
{
SaveFile($_FILES, $_POST); // Alles OK -> File speichern
}
else
echo "No File uploaded.";
//---------------------------------------------------------------------------
//- Funktion/Name : SaveFile -
//- Description : Das empfangene File Verarbeiten -
//- i.E. in einem Verzeichnis speichern, DB Infos -
//- speichern etc. -
//- Values : (array) $aFileData - FILE Systemdaten Uploadfile -
//- (array) $aPostData - POST Systemdaten -
//- Returnvalue : keine (void)) -
//- Author : B. -
//- Date-Written : 10.08.2009 -
//- Changes : -
//---------------------------------------------------------------------------
function SaveFile($aFileData, $aPostData)
{
// Verarbeitung der empfangenen Datei
} // SaveFile()
//---
//- HTML BEREICH
//---
?>
<html>
<head>
<title>File Upload</title>
<script type=text/javascript>
<!--
//<![CDATA[
function ajax(element, uid)
{
var req;
try
{
req = window.XMLHttpRequest?new XMLHttpRequest():
new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
//Kein AJAX Support
}
req.onreadystatechange = function()
{
if ((req.readyState == 4) && (req.status == 200))
{
element.innerHTML = req.responseText;
sText = new String(req.responseText);
//---
//- Den response Text auswerten (transfer complete) suchen
//- dann Schleife beenden und reset / close durchfuehren
//---
if (sText.indexOf('transfer complete') > -1)
{
sleep(2000);
window.clearInterval(aktiv);
window.close();
}
}
}
req.open('GET', 'uploadstatus.php?uid='+uid);
req.send(null);
} // ajax()
//]]>
function CheckFile(element)
{
var sFileName = document.upload.file.value;
check = checkExt(sFileName);
if (check == true)
{
document.getElementById('upload').submit();
inner = document.getElementById('status');
aktiv = window.setInterval('ajax(inner, document.getElementById(\'APC_UPLOAD_PROGRESS\').value)', '750');
return true;
}
else
{
window.close();
return false;
}
} // function CheckFile()
function checkExt(value)
{
var exts = "jpg|jpeg|gif";
//var exts = ".*"; //Wenn alle Erweiterung akzeptiert werden sollen
if (value == "")
return true;
var re = new RegExp("^.+\.("+exts+")$","i");
if (!re.test(value))
{
alert("This file extension is not allowed: \n" + value + "\n\nOnly these extensions are allowed: "+exts.replace(/\|/g,',')+" \n\n");
return false;
}
return true;
} // checkExt()
function sleep(ms)
{
var zeit =(new Date()).getTime();
var stoppZeit = zeit + ms;
while((new Date()).getTime() < stoppZeit){};
} // sleep()
function StopTransfer(element)
{
window.close();
} // StopTransfer()
-->
</script>
</head>
<body>
<iframe src="upload.php" name="hidden_upload" id="hidden_upload" style="display:none"></iframe>
<form id="upload" name="upload" action="fileupload.php" target="hidden_upload" method="post" enctype="multipart/form-data">
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="APC_UPLOAD_PROGRESS" value="<?php echo uniqid();?>"/>
<input type='file' style='width: 400px' name='file' id='file' accept='text/*'>
<input type='button' value='upload' onClick='this.disabled=true; CheckFile(this);'>
<input type='button' value='close / stop' onClick='StopTransfer(this);'>
<div id="status"></div>
</div>
</form>
</body>
</html>
Die JS Funktion sleep(), die ich hier mit 2 Sek. aufrufe, ist nur vorhanden, damit man den Ladebalken auch mal mit einer 100% Anzeige zu sehen bekommt. Ansonsten verschwindet das Fenster so schnell, dass man den Ladebalken nie komplett sieht (ist doch schade drum.
)
Die uploadstatus.php sieht dann so aus:
Code: Alles auswählen
<?php
//---------------------------------------------------------------------------
//- Name : uploadstatus.php -
//- Descript: Erzeugt ueber AJAX eine Timergesteuerte APC Abfrage im -
//- Background zur Ermittlung der uebertragenen Bytes, -
//- waehrend des uploads. -
//- Das Ergebnis dieser Informationsabfrage wird zur Anzeige -
//- eines Fortschrittsbalkens benötigt. -
//- Am Ende des Transfers wird ein Flag uebertragen, wodurch -
//- der Timer beendet wird und eine Aktualisierung (refresh) -
//- der Upload Seite erzeugt wird. -
//- created: 10.08.2009 - B. -
//- change: -
//---------------------------------------------------------------------------
$arr = apc_fetch("upload_{$_GET['uid']}");
if (empty($arr))
echo "";
else
{
$nPro = sprintf("%2d", abs(round(101) / $arr['total'] * $arr['current']));
echo "
<div id='ladebalken' style='position:relative; width:100px; background-color: #C0C0C0;'>
<span style='position: absolute; width: 100%; z-index: 3; text-align: center;'>". $nPro ."%</span>
<div style='position: relative; width: ". $nPro ."%; background-color: #00FF00; color: #00FF00;z-index:2;'>.</div>
</div>
";
//---
//- Am Ende des Transfer diesen String senden um timer zu beenden und refresh der Uploadseite zu erzeugen
//---
if ($nPro > 100)
echo "transfer complete";
}
?>
Ich habe das obige Beispiel hier bei mir grad mal getestet und es läuft einwandfrei.
Achsoja.... Damit APC funktioniert, ist eine kleine Änderung in der php.ini notwendig, wenn nicht eh schon vorhanden.
Bei mir musste ich folgende Änderungen durchführen.
Code: Alles auswählen
extension=php_apc.dll (Kommentar ';' entfernen)
[APC]
;zend_extension = ""
apc.mode = on
apc.mode = shm
apc.enabled=1
apc.shm_segments=2
apc.shm_size=30
apc.ttl=7200
apc.user_ttl=7200
apc.num_files_hint=1024
apc.mmap_file_mask=/tmp/apc.XXXXXX
apc.max_file_size = 200M
apc.post_max_size = 200M
apc.upload_max_filesize = 200M
apc.enable_cli=0
apc.rfc1867=1
Ein sehr gute Erklärung zu APC ist hier zu finden
APC