ajax reponse text not recognised.
Posted: Thu Jan 24, 2008 3:40 pm
I have a dropdown list in which the user can select the amount of images they wish to upload. The response div is then populated, through respnseText, with the correct number of file inputs.
When the form is submitted and i check for files it comes up as empty.
I believe this is because the inputs might not be recognised by the php code which processes the uploads, because the inputs are dynamically created through ajax.
Here's the code (index.php):
serveResponse.php (used to populate the dropDown):
And finally
upload.php
Any ideas on how i could remedy this?
When the form is submitted and i check for files it comes up as empty.
I believe this is because the inputs might not be recognised by the php code which processes the uploads, because the inputs are dynamically created through ajax.
Here's the code (index.php):
Code: Select all
<?php
function generateInputs($_begin, $_end)
{
for( $_i = $_begin; $_i <= $_end; ++$_i )
{
echo "<option name=\"$_i\" id=\"$_i\" value=\"$_i\">$_i</option>";
if( $_i != $_end ) echo "\n\t\t";
else echo "\n";
}
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>MAHCUZ - Image Hosting</title>
<link href="http://mahcuz.com/frontPage.css" rel="stylesheet" type="text/css" />
<script src="common/response.js" type="text/javascript"></script>
<script type="text/javascript" src="common/common.js">
</script>
</head>
<body>
<div id="header">
<h1>Yo, localhost!</h1>
<p>Whaddap?</p>
</div>
<div id="content" align="center">
<div style="text-align: left; width: 800px; border: solid black 1px; padding: 10px 20px;">
<form
name="ajaxForm"
method="post"
action="upload.php"
onsubmit="
document.getElementById('response').style.display='none';
document.getElementById('inProgress').style.display=''";
>
<p>
Amount of images to upload:
<select
name="dropDown"
onchange="
ajaxFunction(this.value);
toggleInputOff();
document.ajaxForm.upload.disabled=false;
document.getElementById('response').style.display='';
document.getElementById('inProgress').style.display='none';"
id="dropDown">
<?php echo generateInputs(1, 5);?>
</select>
<input type="checkbox" name="checkbox" onclick="toggleInput()" /><br />
<input
type="submit"
name="upload"
value="Upload Files"
disabled="true"
/>
<div id="response" align="center">
</div>
<div id="inProgress" align="center" style="display: none;">
<p>Please be patient - The greater the amount of files you have chosen to upload, the greater the time will be until completion.</p>
<p>Thankyou for using <small>rawr.mahcuz.com</small></p>
</div>
</form>
</div>
</div>
</body>
Code: Select all
<?php
$_no = $_GET['i'];
for( $_i = 1; $_i <= $_no; ++$_i )
{
echo "File $_i » <input type=\"file\" name=\"file[]\" /><br />";
}
?>
upload.php
Code: Select all
echo "<pre>";
print_r($_FILES['file']['name']);
echo "</pre>"