I have built this fairly rudimentary file uploading system in the admin section of the site but I thought I'd jazz it up a little by adding some AJAX. So far, I have almost everything done except for when I post the file, the location to be saved (in a hidden input) is conveyed but the filename itself isn't. Here is the HTML/AJAX
Index.html
HTML Code:
<HTML>
<head>
<title>Podaci Rješenja</title>
<meta http-equiv="refresh" content="1195; URL=logout.php">
<script type="text/javascript" src="https://podaci.co.uk/~mason/bank/prototype.js"></script>
<script type="text/javascript">
<!--
var xmlhttp = false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
xmlhttp = new XMLHttpRequest();
}
function makerequest(serverPage, objID) {
var obj = document.getElementById(objID);
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
//-->
</script>
<script>
function sendRequest() {
new Ajax.Request("upload.php",
{
method: 'post',
postBody: 'uploaded='+ $F('uploaded')+'&location='+ $F('location'),
onComplete: showResponse
});
}
function showResponse(req){
$('show').innerHTML= req.responseText;
}
</script></head>
<body onload="makerequest ('redirect.php','form')">
<table width="100%" height="100%" cellspacing="0" cellpadding="0">
<tr class="WindowHeader" height="35">
<td class="headerText" width="16%" align="center">MUP Vrh</td>
<td class="headerSubText" align=right width="84%"> </td>
</tr>
<tr>
<td class="WindowHeader" valign="top">
<table width="100%">
<tr>
<td>
</td>
</tr>
</table>
</td>
<td valign="top">
<blockquote>
<br>
<div class="insideTitle">Svaraj Archiva</div>
<br><p style="text-align: center; font-weight: bold;">Odaslajte datoteke</hp>
<div style="text-align: center;"><a href="redirect.php?image" onclick="makerequest('redirect.php?image','form'); return false;"> Slika</a> | <a href="redirect.php?audio" onclick="makerequest('redirect.php?audio','form'); return false;">Audio</a> | <a href="redirect.php?document" onclick="makerequest('redirect.php?document','form'); return false;">Dokument</a></div>
<br />
<br />
<div id="form"></div>
</blockquote>
</td>
</tr>
<tr>
<td bgcolor="#336699"></td>
<td class="copyrightInfo" valign="bottom" style="padding:5px;">
<p style="text-align: center;"><a href="create_debt.php">Svaraj Archiva</a> | <a href="view_debt.php">Vidite Aktualih Archive</a> | <a href="/calendar">Kalendar</a> | <a href="logout.php">Odjavite se</a></p><br />
<br />
</td>
</tr>
</table>
</body>
</html>
Redirect.php
PHP Code:
<?php
echo <<<EOT
<form id="upload" enctype="multipart/form-data" onsubmit="return false;">
EOT;
if (isset($_GET['audio'])) {
?>
<p style="text-align: left; color: red;">Audio</p>
<input type="hidden" name="location" id="location" value="c:/xampp/htdocs/design/audio/" />
Molimo odaberite datoteku: <input name="uploaded" id="uploaded" type="file" /><br /><br />
<input type="submit" value="U redu" name="submit" id="submit" onClick="sendRequest()" />
<?php
}
if (isset($_GET['image'])){
?>
<p style="text-align: left; color: red;">Slika</p>
<input type="hidden" name="location" id="location" value="c:/xampp/htdocs/design/images/" />
Molimo odaberite datoteku: <input name="uploaded" id="uploaded" type="file" /><br /><br />
<input type="submit" value="U redu" name="submit" id="submit" onClick="sendRequest()" />
<?php
}
if (isset($_GET['document'])) {
?>
<p style="text-align: left; color: red;">Dokument</p>
<input type="hidden" name="location" id="location" value="c:/xampp/htdocs/design/documents/" />
Molimo odaberite datoteku: <input name="uploaded" id="uploaded" type="file" /><br /><br />
<input type="submit" value="U redu" name="submit" id="submit" onClick="sendRequest()" />
<?php
}
if (!isset($_GET['audio']) && !isset($_GET['image']) && !isset($_GET['document'])) {
echo "Molimo odaberite vrstu datoteke za odaslati.";
}
echo "</form><br /><br /><div id=\"show\"></div>";
Upload.php
PHP Code:
<?php
session_start();
if (!isset($_SESSION['SESSION_NAME'])) {
echo "Access Denied";
die();
}
$message1 = "";
$message2 = "";
if (isset($_POST['location']) && isset($_POST['uploaded'])) {
$target = $_POST['location'];
$target = $target . basename( $_FILES['uploaded']['name']) ;
$ok=1;
//This is our size condition
if ($uploaded_size > 350000)
{
$message1 = "Your file is too large.<br>";
$ok=0;
}
//This is our limit file type condition
if ($uploaded_type =="text/php")
{
$message1 = "No PHP files<br>";
$ok=0;
}
//Here we check that $ok was not set to 0 by an error
if ($ok==0)
{
$message1 = "Sorry your file was not uploaded";
}
//If everything is ok we try to upload it
else
{
if(move_uploaded_file($_FILES['uploaded']['tmp_name'], $target))
{
$message2 = "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded";
}
else
{
$message1 = "Sorry, there was a problem uploading your file.";
}
}
?>
<p style="text-align: center; font-weight: bold; color: red;"><?php echo $message1; ?></p>
<p style="text-align: center; font-weight: bold; color: green;"><?php echo $message2; ?></p>
<p></p>
<p></p>
<p style="text-align: center;"><a href="create_debt.php">[ Back ]</a></p>
<?php
die();
}
?>
Also i know the code on upload.php is correct because I'm using almost the same thing on my temporary upload page.
LinkBack URL
About LinkBacks
AJAX file upload system (PHP)
Reply With Quote
