0

I am having a dynamic form(drag and drop form) using Jquery which has multiple input type=file. So the name of the input type changes using a random number. Below is a sample code from view source:

<?php echo $error;?>
<?php echo form_open_multipart('upload/do_upload');?>
<form action="" enctype="multipart/form-data" method="post" accept-charset="utf-8">                            
<div id="sjfb-fields">

    <div class="my-3 p-3 bg-white rounded box-shadow">
            <div id="sjfb-399480" class="sjfb-field sjfb-images" style="min-height:100px;">
                <label for="images-399480" style="color:grey;font-size:12px">Upload the screenshot</label>

                <input type="file" name="img-399480" id="images-399480">
            </div>
    </div>

    <div class="my-3 p-3 bg-white rounded box-shadow">
        <div id="sjfb-857945" class="sjfb-field sjfb-images" style="min-height:100px;">
            <label for="images-857945" style="color:grey;font-size:12px">Test Images</label>
            <input type="file" name="img-857945" id="images-857945">
            </div>
    </div>
    <div class="my-3 p-3 bg-white rounded box-shadow">
        <div id="sjfb-792565" class="sjfb-field sjfb-images" style="min-height:100px;">
            <label for="images-792565" style="color:grey;font-size:12px">More Images</label>

            <input type="file" name="img-792565" id="images-792565">
           </div>
    </div>
</div>
<button type="submit" name="save" class="btn btn-primary">Save</button>
</form>

I have used below code in the controller for one image upload:

                    $config['upload_path']   = 'public/Uploads/Inspection/';
                    $config['allowed_types'] = 'gif|jpg|png'; 
                    $config['max_size']      = 100; 
                    $config['max_width']     = 1024; 
                    $config['max_height']    = 768; 

                    $this->load->library('upload', $config);
                    if ( ! $this->upload->do_upload('userfile')) 
                    {
                       $error = array('error' => $this->upload->display_errors()); 

                    }
                    else 
                    { 
                       $data = array('upload_data' => $this->upload->data()); 

                    }

I have tried the upload with one input type="file" and it works(used image's name userfile). This form has multiple input type=file and I was wondering is there any way I can upload the files separately? I am new to codeigniter as well

Thanks!

2
  • Refer to this link stackoverflow.com/questions/20113832/… for multiple file uploads Commented Jun 14, 2019 at 4:57
  • Thanks for the comment.Multiple upload from single input type="file" can use userfile[] as name. But I need multiple upload using separate input type="file" Commented Jun 14, 2019 at 5:00

1 Answer 1

1

Check this out :

controller part :

    $files = $_FILES;  //getting the files from post
    $cpt = count($_FILES['photo']['name']); //number of files uploaded

    for($i=0;$i<$cpt;$i++){  // in loop to upload multiple files

      $file_name=$_FILES['photo']['name'][$i];

      if($i==0){     //name the file according to the number /name as u like
        echo $i;
       $name='_first';

      }elseif($i==2){

       $name='_second';  

      }else{

        $name='_third';

      }

//ci library to upload photos $this->load->library('upload');

        $_FILES['photo']['name']= $files['photo']['name'][$i];
        $_FILES['photo']['type']= $files['photo']['type'][$i];
        $_FILES['photo']['tmp_name']= $files['photo']['tmp_name'][$i];
        $_FILES['photo']['error']= $files['photo']['error'][$i];
        $_FILES['photo']['size']= $files['photo']['size'][$i];



      $config = array(
            'file_name'     => $name,
            'allowed_types' => 'jpg',    //add option as u like
            'max_size'      => 3000,
            'overwrite'     => TRUE,
            'upload_path'=>'./uploads/'      //use your respective path to upload
      );

      $this->upload->initialize($config);
   if (!$this->upload->do_upload('photo')) {
      $data_error = array('msg' => $this->upload->display_errors());

                  } else {

                      $data = $this->upload->data();

                  }

    }

And Form in html to upload Photos : input name changed to photo[] for all

<?php echo $error;?>
<?php echo form_open_multipart('upload/do_upload');?>
<form action="" enctype="multipart/form-data" method="post" accept-charset="utf-8">                            
<div id="sjfb-fields">

    <div class="my-3 p-3 bg-white rounded box-shadow">
            <div id="sjfb-399480" class="sjfb-field sjfb-images" style="min-height:100px;">
                <label for="images-399480" style="color:grey;font-size:12px">Upload the screenshot</label>

                <input type="file" name="photo[]" id="images-399480">
            </div>
    </div>

    <div class="my-3 p-3 bg-white rounded box-shadow">
        <div id="sjfb-857945" class="sjfb-field sjfb-images" style="min-height:100px;">
            <label for="images-857945" style="color:grey;font-size:12px">Test Images</label>
            <input type="file" name="photo[]" id="images-857945">
            </div>
    </div>
    <div class="my-3 p-3 bg-white rounded box-shadow">
        <div id="sjfb-792565" class="sjfb-field sjfb-images" style="min-height:100px;">
            <label for="images-792565" style="color:grey;font-size:12px">More Images</label>

            <input type="file" name="photo[]" id="images-792565">
           </div>
    </div>
</div>
<button type="submit" name="save" class="btn btn-primary">Save</button>
</form>

Working on my local see this https://www.codeigniter.com/user_guide/libraries/file_uploading.html for config option

Sign up to request clarification or add additional context in comments.

2 Comments

Thank you for this. What if the user didn't add the first image and add the second and third. I getting offset error
u can check if ($_FILES['photo']['name'][$i]==null ) and escape the part it wont give error

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.