Home > Net >  How to get multiple file upload with different name
How to get multiple file upload with different name

Time:11-08

I want to upload multiple files and get the name of file to be upload:

I have for a type_demand some type_file to be uploaded

E.g : for type_demand A i can upload type_file X, Y, Z

In my php i want to get the 3 files and know what is the X, the Y and the Z.

here an example of my form:

<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" method="post" 

enctype="multipart/form-data">
  

  <label for="type">Files to upload:</label>


  <div class="form-group row">
    <label for="FormControlFile1" class="col-sm-2 col-form-label">X</label>
    <input type="file" class="form-control-file col-sm-10" id="FormControlFile1" name="myfile[]">
  </div>

<div class="form-group row">
    <label for="FormControlFile2" class="col-sm-2 col-form-label">Y</label>
    <input type="file" class="form-control-file col-sm-10" id="FormControlFile2" name="myfile[]">
  </div>
 
<div class="form-group row">
    <label for="FormControlFile3" class="col-sm-2 col-form-label">Z</label>
    <input type="file" class="form-control-file col-sm-10" id="FormControlFile3" name="myfile[]">
  </div>
  

</div>

  <button type="submit" class="btn btn-primary" name="upload">Upload</button>
   
</form>

and this is my php code:

<?php  
 if ($_SERVER['REQUEST_METHOD'] == 'POST') {
 
 if(isset($_FILES['myfile'])){
     $tmp_arr= $_FILES['myfile'];
 }
 // Create an array with desired structure.
 for($i=0; $i<count($tmp_arr['name']); $i  ){
     $files[] = array(
         'name'     =>  $tmp_arr['name'][$i],
         'type'     =>  $tmp_arr['type'][$i],
         'tmpName'  =>  $tmp_arr['tmp_name'][$i],
         'error'    =>  $tmp_arr['error'][$i],
         'size'     =>  $tmp_arr['size'][$i],
    //i want to have another information here to know if it's X, Y or Z file 
     );
 }

 
foreach($files as $file){
         echo '<br/>'.$file['name'] .' is for :' ;
}

as result i want to have for example:

NameOfFile1 is for: X

NameOfFile2 is for: Y

NameOfFile3 is for: Z

Thank you

CodePudding user response:

You ought to be able to assign the name ( whatever you want within reason ) to the field in the HTML as you are already using an array style syntax. For example:

<?php
    $field='myfile';
    $errors=array();

    
    if( $_SERVER['REQUEST_METHOD']=='POST' && isset( $_FILES[ $field ] ) ){
        $obj=$_FILES[ $field ];
        
        foreach( $obj['name'] as $index => $void ){
            /*
                $index refers to the name assign in `myfile['fieldname']`
            */
            $name=$obj['name'][ $index ];
            $tmp=$obj['tmp_name'][ $index ];
            $error=$obj['error'][ $index ];
            $type=$obj['type'][ $index ];
            $size=$obj['size'][ $index ];
            $ext=strtolower(pathinfo($name,PATHINFO_EXTENSION));
            
            // do stuff...
            printf(
                '
                <h1>%s</h1>
                <pre>%s</pre>
                ',
                $index,
                print_r($obj,true)
            );
            
            //next
        }
    }
?>

And the modified HTML to include X,Y & Z as names. IDs removed and elements located within the label themselves as it means less HTML code.

<form method="post" enctype="multipart/form-data">
    <fieldset>
        <legend>Files to upload:</legend>
        
        <div class="form-group row">
            <label class="col-sm-2 col-form-label">
                X : <input type="file" class="form-control-file col-sm-10" name="myfile[X]">
            </label>
        </div>

        <div class="form-group row">
            <label class="col-sm-2 col-form-label">
                Y: <input type="file" class="form-control-file col-sm-10" name="myfile[Y]">
            </label>
        </div>

        <div class="form-group row">
            <label class="col-sm-2 col-form-label">
                Z: <input type="file" class="form-control-file col-sm-10" name="myfile[Z]">
            </label>
        </div>
    </fieldset>
    <button type="submit" class="btn btn-primary" name="upload">Upload</button>
</form>

CodePudding user response:

No need to re-invent the wheel.

The jQuery File Upload Plugin (by heyageek) does all that you want and is minimal and time-tested. (I've been using it successfully for years)

Note that he has sample code for the client side (jQuery) and for the server (PHP).

You will want to look at the formData and/or dynamicFormData features, which allow you to collect other data before submit and send them (along with the uploaded file) to your back-end processing file.

dynamicFormData: function()
{
    //var data ="XYZ=1&ABCD=2";
    var data ={"XYZ":1,"ABCD":2};
    return data;        
}

Here is a sample upload script that will show you how to get the names of the files that were uploaded (see line 18):

$fileName = $_FILES["myfile"]["name"];

Note that the myfile matches up with the filename in the javascript ajax block:

<script>
$(document).ready(function()
{
    $("#fileuploader").uploadFile({
    url:"YOUR_FILE_UPLOAD_URL",
    fileName:"myfile"
    });
});
</script>

Study the examples on the "Getting Started" tab, and on the "Server Side" (PHP Files, up top) and you'll have all your problems resolved in minutes.

Reference

Here's another example that uses the plugin: PHP file upload inside modal window

  • Related