Kamis, 15 September 2016

Fungsi Upload File Codeigniter


Pada tutorial kali ini, saya akan menshare bagaimana membuat fungsi upload file menggunakan codeigniter. sebelum memulainya, untuk konsep MVC harus sudah dipahami agar dapat memahami kode berikut dengan jelas. Sebelum membuat fungsi upload load terlebih dahulu helper('form','url','file') pada file autoload.php.
Berikut kode pada fungsi upload yang digunakan untuk proses upload file.

public function do_upload() { 
         //UPLOAD
         $file = $_FILES['userfile'];
         $file_name = $file['name'];
         $config['upload_path']   = './uploads/'; 
         $config['allowed_types'] = 'gif|jpg|png|pdf|doc|docx'; 
         $config['max_size']      = 10000; 
         $config['max_width']     = 1024; 
         $config['max_height']    = 768;  
         $config['file_name']       = $file['name'];
         $this->load->library('upload', $config);
   //CEK APAKAH UPLOAD BERHASIL ATAU TIDAK, JIKA TIDAK BERHASIL MUNCULKAN ERROR 
         //JIKA BERHASIL LANJUT KE PROSES SELANJUTNYA
         if ( ! $this->upload->do_upload('userfile')) {
            $error = array('error' => $this->upload->display_errors()); 
            $this->load->view('vupload', $error); 
         }
         //PROSES MENYIMPAN DATA KE DATABASE
         else { 
            $data['nama']=$this->input->post('namafile');
            $data['path']=$file_name;
            $this->mupload->simpan($data);
            $error=array('error'=>'File has been uploaded'); 
            $this->load->view('vupload', $error); 
         } 
      }
 
Setelah itu buat fungsi menyimpan data pada modelnya, pada contoh diatas model yang saya buat adalah mupload->simpan, berikut kode untuk proses simpan data pada modelnya.

function simpan($data){
        $this->db->insert('upload', $data);
     }

langkah berikutnya membuat viewnya, pada contoh dibawah ini saya menggunakan bootstrap dengan menggunakan tambahan adminLTE untuk mempermudah membuat viewnya, berikut kodenya

<!DOCTYPE html>
<html>
<head>
 <title>Upload</title>
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="stylesheet" href="<?php  echo base_url();?>asset/css/bootstrap.css">

 <link rel="stylesheet" href="<?php  echo base_url();?>asset/dist/css/AdminLTE.css">

 <script src="<?php echo base_url();?>asset/js/jquery.js"></script>
  <script src="<?php echo base_url();?>asset/js/bootstrap.min.js"></script> 
   <script src="<?php echo base_url();?>asset/js/bootstrap-filestyle.min.js"></script> 
</head>
<script>
 $(":file").filestyle({buttonName: "btn-primary"});
</script>
<body style="background-color:#3B3B3B;">
<div class="container">
  <div class="col-md-6 col-sm-offset-3" style="margin-top:50px;">
          <!-- general form elements -->
          <div class="box box-danger">
            <div class="box-header with-border">
              <h3 class="box-title">Upload File</h3>
            </div>
            <!-- /.box-header -->
            <!-- form start -->

          <?php echo form_open_multipart('upload/do_upload',array('method'=>'POST'));?> 
              <div class="box-body">
                <div class="form-group ">
                  <label for="exampleInputEmail1">Nama File</label>
                  <input type="text" class="form-control" name="namafile" id="exampleInputEmail1" placeholder="Nama File">
                </div>
                <div class="form-group hide">
                  <label for="exampleInputPassword1">Jenis</label>
                  <input type="text" class="form-control" id="exampleInputPassword1" placeholder="Jenifile">
                </div>
                <div class="form-group">
                  <label for="exampleInputFile">File input</label>
                  <input type="file" name="userfile" class="filestyle" data-buttonName="btn-primary"/>
                  <span class="label label-danger">Maksimal 3MB</span>
                  <br>
                  <?php 
                  echo $error;?> 

                  <!--
                  <p class="help-block">Format file PDF</p>
                  -->
                </div>
                <div class="checkbox hide">
                  <label>
                    <input type="checkbox"> Check me out
                  </label>
                </div>
              </div>
              <!-- /.box-body -->

              <div class="box-footer">
                <button type="submit" class="btn btn-danger btn-fla pull-right">Upload</button>
              </div>
            </form>
          </div>
          <!-- /.box -->
</div>
</body>
</html>

Jika sudah, gambar berikut adalah hasil akhirnya, jika ada yang minat untuk programnya bisa menuliskan alamat email dikomentar, nanti akan saya kirim melalui email.

Load disqus comments

0 komentar