• September 9, 2018

    +https://davidwalsh.name/multiple-file-upload

    The HTML

    <!-- IMPORTANT:  FORM's enctype must be "multipart/form-data" -->
    <form method="post" action="upload-page.php" enctype="multipart/form-data">
      <input name="filesToUpload[]" id="filesToUpload" type="file" multiple="" />
    </form>

    Simply adding the multiple attribute allows for multiple files to be uploaded via one INPUT element.  If you’re a stickler for validation, you’ll want to assign the multiple attribute a value of multiple.

    Listing Multiple Files with JavaScript

    //get the input and UL list
    var input = document.getElementById('filesToUpload');
    var list = document.getElementById('fileList');
    
    //empty list for now...
    while (list.hasChildNodes()) {
    	list.removeChild(ul.firstChild);
    }
    
    //for every file...
    for (var x = 0; x < input.files.length; x++) {
    	//add to list
    	var li = document.createElement('li');
    	li.innerHTML = 'File ' + (x + 1) + ':  ' + input.files[x].name;
    	list.append(li);
    }

    The input.files property provides an array of files for which you can check the length;  if there’s a length, you can loop through each file and access the file paths and names.

    Receiving and Handling Files with PHP

    if(count($_FILES['uploads']['filesToUpload'])) {
    	foreach ($_FILES['uploads']['filesToUpload'] as $file) {
    	    
    		//do your upload stuff here
    		echo $file;
    		
    	}
    }

    PHP creates an array of the files uploaded with the given INPUT’s name.  This variable will always be an array within PHP.



เวอไนน์ไอคอร์ส

ประหยัดเวลากว่า 100 เท่า!






เวอไนน์เว็บไซต์⚡️
สร้างเว็บไซต์ ดูแลเว็บไซต์

Categories