上傳和查看在同一網頁的多個圖像笨

Question

此圖片顯示了我需要笨做。我有一個頁面有幾個div標籤。我需要上傳圖片並在相同的地方顯示。但是應該有3個不同的圖像和3個不同的文件位置來保存這些圖像。我嘗試了很多方法。請有想法的人幫助我。

我控制器

<?php 
     if (!defined('BASEPATH')) 
      exit('No direct script access allowed'); 
     class Upload_Controller extends CI_Controller 
     { 
      public function __construct() 
      { 
       parent::__construct(); 
      } 
      public function index(){ 
       $this->load->view('file_view', array(
        'error' => ' ' 
       )); 
      } 
      public function file_view() 
      { 
       $this->load->view('file_view', array(
        'error' => ' ' 
       )); 
      } 
      public function do_upload() 
      { 
       $config = array(
        'upload_path' => "./uploads/", 
        'allowed_types' => "gif|jpg|png|jpeg|pdf", 
        'overwrite' => TRUE, 
        'max_size' => "2048000", // Can be set to particular file size , here it is 2 MB(2048 Kb) 
        'max_height' => "768", 
        'max_width' => "1024" 
       ); 
       $this->load->library('upload', $config); 
       if ($this->upload->do_upload()) { 
        $data = array(
         'upload_data' => $this->upload->data() 
        ); 
        $this->load->view('file_view', $data); 
       } else { 
        $error = array(
         'error' => $this->upload->display_errors() 
        ); 
        $this->load->view('file_view', $error); 
       } 
      } 
      public function do_upload2() 
      { 
       $config = array(
        'upload_path' => "./uploads/index2/", 
        'allowed_types' => "gif|jpg|png|jpeg|pdf", 
        'overwrite' => TRUE, 
        'max_size' => "2048000", // Can be set to particular file size , here it is 2 MB(2048 Kb) 
        'max_height' => "768", 
        'max_width' => "1024" 
       ); 
       $this->load->library('upload', $config); 
       if ($this->upload->do_upload()) { 
        $data = array(
         'upload_data' => $this->upload->data() 
        ); 
        $this->load->view('file_view', $data); 
       } else { 
        $error = array(
         'error1' => $this->upload->display_errors() 
        ); 
        $this->load->view('file_view', $error); 
       } 
      } 
     } 
     ?> 

我查看

<div id="1"> 
<?php echo form_open_multipart('upload_controller/do_upload');?> 
<?php echo "<input type='file' name='userfile' size='20' />"; ?> 
<?php echo "<input type='submit' name='submit' value='upload' /> ";?> 
<?php echo "</form>"?> 
</div> 
<div id="2"> 

<h3>Your file was successfully uploaded!</h3> 
    <!-- Uploaded file specification will show up here --> 
    <ul> 

      <li> 


      </li> 
      <img alt="Your uploaded image" src="<?=base_url(). 'uploads/' . $upload_data['file_name'];?>"> 

    </ul> 
</div> 

<div id="3"> 

<?php echo form_open_multipart('upload_controller/do_upload2');?> 
<?php echo "<input type='file' name='userfile' size='20' />"; ?> 
<?php echo "<input type='submit' name='submit' value='upload' /> ";?> 
<?php echo "</form>"?> 
</div> 

<div id="4"> 

    <h3>Your file was successfully uploaded!</h3> 
    <!-- Uploaded file specification will show up here --> 
    <ul> 

      <li> 


      </li> 
      <img alt="Your uploaded image" src="<?=base_url(). 'uploads/index2/' . $upload_data['file_name'];?>"> 

    </ul> 
    <p> 
     <?php echo anchor('upload_controller/file_view', 'Upload Another File!'); ?> 
    </p> 
</div> 

Answer 1

試試這個代碼：

<form method="post" action="uploader/go" enctype="multipart/form-data"> 
    <input type="file" name="image1" /><br /> 
    <input type="file" name="image2" /><br /> 
    <input type="file" name="image3" /><br /> 
    <input type="file" name="image4" /><br /> 
    <input type="file" name="image5" /><br /> 
    <input type="submit" name="go" value="Upload!!!" /> 
</form> 

這裏控制器代碼：

class Uploader extends Controller { 
function go() { 
if(isset($_POST['go'])) { 
    /* Create the config for upload library */ 
    /* (pretty self-explanatory) */ 
    $config['upload_path'] = './assets/upload/'; /* NB! create this dir! */ 
    $config['allowed_types'] = 'gif|jpg|png|bmp|jpeg'; 
    $config['max_size'] = '0'; 
    $config['max_width'] = '0'; 
    $config['max_height'] = '0'; 
    /* Load the upload library */ 
    $this->load->library('upload', $config); 

    /* Create the config for image library */ 
    /* (pretty self-explanatory) */ 
    $configThumb = array(); 
    $configThumb['image_library'] = 'gd2'; 
    $configThumb['source_image'] = ''; 
    $configThumb['create_thumb'] = TRUE; 
    $configThumb['maintain_ratio'] = TRUE; 
    /* Set the height and width or thumbs */ 
    /* Do not worry - CI is pretty smart in resizing */ 
    /* It will create the largest thumb that can fit in those dimensions */ 
    /* Thumbs will be saved in same upload dir but with a _thumb suffix */ 
    /* e.g. 'image.jpg' thumb would be called 'image_thumb.jpg' */ 
    $configThumb['width'] = 140; 
    $configThumb['height'] = 210; 
    /* Load the image library */ 
    $this->load->library('image_lib'); 

    /* We have 5 files to upload 
    * If you want more - change the 6 below as needed 
    */ 
    for($i = 1; $i < 6; $i++) { 
    /* Handle the file upload */ 
    $upload = $this->upload->do_upload('image'.$i); 
    /* File failed to upload - continue */ 
    if($upload === FALSE) continue; 
    /* Get the data about the file */ 
    $data = $this->upload->data(); 

    $uploadedFiles[$i] = $data; 
    /* If the file is an image - create a thumbnail */ 
    if($data['is_image'] == 1) { 
     $configThumb['source_image'] = $data['full_path']; 
     $this->image_lib->initialize($configThumb); 
     $this->image_lib->resize(); 
    } 
    } 
} 
/* And display the form again */ 
$this->load->view('upload_form'); 

} }