Page 1 of 1

ajax reponse text not recognised.

Posted: Thu Jan 24, 2008 3:40 pm
by markusn00b
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):

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>
 
serveResponse.php (used to populate the dropDown):

Code: Select all

 
<?php
$_no = $_GET['i'];
 
for( $_i = 1; $_i <= $_no; ++$_i )
{
    echo "File $_i &raquo; <input type=\"file\" name=\"file[]\" /><br />";
}
?>
 
And finally
upload.php

Code: Select all

 
echo "<pre>";
print_r($_FILES['file']['name']);
echo "</pre>"
 
Any ideas on how i could remedy this?

Re: ajax reponse text not recognised.

Posted: Thu Jan 24, 2008 4:06 pm
by Kieran Huggins
try:

Code: Select all

print_r($_FILES);

Re: ajax reponse text not recognised.

Posted: Thu Jan 24, 2008 4:10 pm
by pickle
If the fields are being POSTed in your form, PHP will see them. So either a) they're not being posted, or b) they're not what/where you expect.

AJAX isn't necessary for this, and is actually not the best choice. All you're using AJAX for is creating some HTML - why not do that in Javascript? It'll certainly cut down on the number of page requests the server has to handle, and will also be more responsive to the user because their computer is doing the work without waiting to (essentially) load another page via the AJAX call.

Using JQuery:

Code: Select all

//invoke this function whenever the value of the element with the id "dropDown" is changed$("#dropDown").change(function(){        //loop through however many fields were requested    for(i=1;i<=$(this).val();i++)    {   //Add a new "file" input field to some div in your page        $("#div-where-fields-go").append("File "+i+' &raquo; <input type="file" name="file[]" /><br />');    }});
Note that this function will always just add the number of fields requested. So if a user chooses 2 fields, then chooses 4 fields, 6 fields will be shown. I'm not sure if that's what your ajaxFunction() function did, as the code wasn't posted.

PHP has absolutely no clue about Javascript or AJAX, so as far as PHP is concerned, it makes no difference whether the fields were hardcoded or were added by AJAX.

Re: ajax reponse text not recognised.

Posted: Thu Jan 24, 2008 5:02 pm
by markusn00b
Kieran Huggins wrote:try:

Code: Select all

print_r($_FILES);
Using that produces:

Code: Select all

 
<pre>Array ( ) </pre>
 
I also added, into the form element, the enctype; i had that feeling of relief when i noticed this missing, expecting it to solve the problem. It didnt.

¬_¬

Re: ajax reponse text not recognised.

Posted: Thu Jan 24, 2008 5:59 pm
by Jonah Bron
Just a side note: in you function, you use echo, and when you implemented the function, you also used echo...

Re: ajax reponse text not recognised.

Posted: Fri Jan 25, 2008 1:32 am
by Kieran Huggins
Try it without javascript: hard coded the way you expect it to be right before the submit. Does it work then?