AJAX/JQuery File Upload - undefined index on 8th Image, handled by PHP

Question

I am using the code from this place: Uploading Multiple Files using AJAX

Upto 7 images get uploaded (of approx size 1MB), and when I am doing the 8th image (OR When I have selected equal to or more than 8 images), this error comes back:

Notice: Undefined index: images in E:\Apache Software Foundation\Apache2.2\htdocs\ReGeneSys\upload2.php on line 10

Warning: Invalid argument supplied for foreach() in E:\Apache Software Foundation\Apache2.2\htdocs\ReGeneSys\upload2.php on line 10

The HTML is:

<div id="main" style="width:40%;margin:0 auto;text-align:center;" ><br/>
        <h4>Use this if you want to upload multiple images</h1>
        <form method="post" enctype="multipart/form-data"  action="upload2.php">
            <input type="file" name="images" id="images" multiple />
            <input type="hidden" name="logId" id="logId" value="<?php echo $_REQUEST['log_id'] ?>" />
            <button type="submit" id="btn">Upload Files!</button>

        </form>

    <div id="response"></div>
        <ul id="image-list">

        </ul>
    </div>

The JS is:

var logId= document.getElementById("logId").value; 
//alert(logId);
(function () {
    var input = document.getElementById("images"), 
        formdata = false;

    /* function showUploadedItem (source) {
        var list = document.getElementById("image-list"),
            li   = document.createElement("li"),
            img  = document.createElement("img");
        img.src = source;
        li.appendChild(img);
        list.appendChild(li);
    }  */ 

    if (window.FormData) {
        formdata = new FormData();
        document.getElementById("btn").style.display = "none";
    }

    input.addEventListener("change", function (evt) {
        document.getElementById("response").innerHTML = "Uploading . . ."
        var i = 0, len = this.files.length, img, reader, file;

        for ( ; i < len; i++ ) {
            file = this.files[i];

            if (!!file.type.match(/image.*/)) {
                if ( window.FileReader ) {
                    reader = new FileReader();
                    /*reader.onloadend = function (e) { 
                        showUploadedItem(e.target.result, file.fileName);
                    };*/
                    reader.readAsDataURL(file);
                }
                if (formdata) {
                    formdata.append("images[]", file);
                }
            }   
        }

        if (formdata) {

            $.ajax({
                url: "upload2.php?logId="+logId,
                type: "POST",
                data: formdata,
                processData: false,
                contentType: false,
                success: function (res) {
                    document.getElementById("response").innerHTML = res; 
                }
            });
        }
    }, false);
}());

The PHP is:

$log_id=$_REQUEST['logId'];
    print_r($_FILES);
    foreach ($_FILES["images"]["error"] as $key => $error) {
        if ($error == UPLOAD_ERR_OK) {

            $name = $_FILES["images"]["name"][$key];
            $path="screens/";
            $append_Name=getScalar("SELECT (COALESCE(MAX(screen_id),1)+1) FROM screenshots LIMIT 1");
            //print_r($_FILES);
            //$image_name=$_FILES['images']['tmp_name'][$key];
            $name=$append_Name."_".$name;
            move_uploaded_file( $_FILES["images"]["tmp_name"][$key], "screens/" . $name);
            ..// other part of the PHP
        }
    }

N.B. getScalar is a function that returns the first value of the result source.

Could you please help me know the issue that occurs post 7th image. Once again mentioning, the code works absolutely fine uptil I haven't uploaded an 8th image of 1MB sizes approx.

The error traces to this line:

  foreach ($_FILES["images"]["error"] as $key => $error)

Thanks.

score 0 · Answer 1 · answered Aug 21 '13 at 09:29

0

You may want to have a look at these:

; Maximum allowed size for uploaded files.
upload_max_filesize = 40M

; Must be greater than or equal to upload_max_filesize
post_max_size = 40M

It could be that your maximum upload size for $_FILES is too large.

Stranger things have happened ;)

answered Aug 21 '13 at 09:29

AO_

2,573
3
30
31

Doesn't help, I have upload_max_filesize = 100M, max_file_uploads = 100. No way, 7 2MB files would make 100M right? Or does M mean Megabits? – Nirav Zaveri Aug 21 '13 at 09:51

AJAX/JQuery File Upload - undefined index on 8th Image, handled by PHP

1 Answers1