File Upload in CodeIgniter
In our previous lesson, we created a user registration with Name, Address, Email, etc. But that does not contain option to upload user image or any file to the database. Uploading image, or any files such as Photos, PDF, Docs, etc are common in almost forms.
We do not upload our files directly into our MySQL database, but we upload the files on a directory and keep their details such as name on the database.
Let us create a simple form with name and a file picker.
Controller: (fileupload)
This controller loads the view form for selecting a file.
public function fileupload()
{
$this->load->helper('url');
$this->load->helper('form');
$this->load->view('user/fileupload');
}
Here the line $this->load->helper(‘form’); helps to select image on your corresponding view page.
View: (fileupload.php)
<html> <head> <title>Registration</title> </head> <body bgcolor="#b1ac4e"> <center> <div class="maindiv"> <h3>Registration</h3> <?php echo form_open_multipart(base_url().'user/uploading') ?> <table> <tr> <td><b>Name </b> </td><td><input type="text" name="username"/></td> </tr> <tr> <td><b>Image</b> </td><td> <input type="file" name="userfile" size="20" /></td> </tr> <tr> <td> </td><td> <input type="submit" value="Register" style="height: 25px; width: 100px; float: center;"/></td> </tr> </table> </form> <div> </center> </body> </html>
<style>
.maindiv
{
margin-top: 13%;
background: gray;
padding: 25px;
width: 305px;
height: auto;
border: 5px solid black;
}
</style>
Note the difference:
Here the tag <form> is replaces with new file uploading form type:
<?php echo form_open_multipart(base_url().’user/uploading’) ?>
We used $this->load->helper(‘form’); on our controller for this type of form.
Where base_url().’user/uploading’ is the form action controller function.
<input type=”file” name=”userfile” size=”20″ />
This input type ‘file’ is used to pick files from your computer. It’s name ‘userfile’ is the default file name. if you change it, then you must specify new name on the controller.
Controller:
As we shown in view, form action sends the form inputs into the controller function ‘uploading’.
public function uploading()
{
$config['upload_path'] = './images';
$config['allowed_types'] = 'gif|jpg|png|jpeg';
$config['max_size'] = '2000';
$config['max_width'] = '2000';
$config['max_height'] = '3000';
$this->load->library('upload', $config);
$this->upload->do_upload('userfile');
echo "Uploaded";
}
Explanation:
$config[‘upload_path’] = ‘./images’;
Variable $config configures uploaded file. Here file uploading path is specified. Here the path is into the project ‘images’ folder. The character ‘./’ means the previous folder of current folder.
$config[‘allowed_types’] = ‘gif|jpg|png|jpeg’;
Here can we can decide the file format(extension) of the uploaded files. If user select a file than these formats, then the file will not be uploaded. In our code, we upload only image formatted files such as gif, jpg, png and jpeg.
$config[‘max_size’] = ‘2000’;
$config[‘max_width’] = ‘2000’;
$config[‘max_height’] = ‘3000’;
These three lines determine the maximum size of the uploaded file as well as the maximum width and height of the uploaded image.
$this->load->library(‘upload’, $config);
This code loads a library file ‘upload’ with the configuration setup ‘$config’.
$this->upload->do_upload(‘userfile’);
This is the code for uploading the file. If we use ‘userfile’ as the name of our file picker, then $this->upload->do_upload(); is enough (no parameter is required). But we should specify the file picker name if we change its name than default name (userfile).
For example:
In view:
<input type=”file” name=”myfile” size=”20″ />
Then in controller, upload code should be:
$this->upload->do_upload(‘myfile’);
Now just run the project:
Select an image file and use the button ‘upload’, now the directory ‘image’ should contain the uploaded image.
As we read above, this coding only upload the images to the specified directory. Never stores any details of the files also we never store files directory on the MySQL database, and database stores only the name of the files.
Let us see how to manage uploaded files such as keeping details of the files, retrieving uploaded files, etc on next lesson.
Be First to Comment