Fala Fala - 1 year ago 86
HTML Question

How to upload an image and save it to database in Codeigniter?

I know this question has been asked millions of times, but all of the questions are a little bit too difficult for beginners.

So what I'm looking for is how to create a simple button that uploads an image and get its full_path and save it in a hidden input of the form, so when i click submit, the form will insert the path with the other inputs, and so the image would have been uploaded to a directory.

It's a simple project, a basic blog page, where I need the following the inputs to be saved:
1. Image
2. Title
3. Body

The only thing i couldn't accomplish is the image part.

So here's the view code:

<h1>Add New Post</h1>
<br />


<input type="text" name="title" />
<input hidden="hidden" name="date" value="<?php echo date('d-m-y');?>"/>

<textarea id="textarea" name="body" rows="10"></textarea>

<input type="submit" value="Submit Post" />

and here's the controller when you click Submit:

// Adds new posts to the database table
function add_post()
$this->form_validation->set_rules('title', 'Title', 'required|min_length[2]');
$this->form_validation->set_rules('body', 'Body', 'required|min_length[2]');

if ($this->form_validation->run() == TRUE) {
$this->db->insert('entries', $_POST);
else {



So please I need someone to tell me how to write the upload function to upload the image on the same page and on the same form, and save its path to the database.

I can make it save the path, but i wanna get the path first and add it to the same form in a hidden input, EX:

Please I really need your help, and if you have any idea on how to help me, please post your answer.

Thanks in advance.

Answer Source

It's very simple to achieve this with CodeIgniter.

I'll use the Version 3.1.0 reference:


<?php echo form_open_multipart('upload/do_upload');?>

<input type="file" name="userfile" size="20" />

<br /><br />

<input type="submit" value="upload" />



 public function do_upload() {

        $fileData = array();
        // File upload script
            'upload_path' => './uploads/',
            'overwrite' => false,
            'max_filename' => 300,
            'encrypt_name' => true,
            'remove_spaces' => true,
            'allowed_types' => 'gif|jpg|png',
            'max_size' => 100,
            'xss_clean' => true,

        $this->form_validation->set_rules('title', 'Title', 'required|min_length[2]');
        $this->form_validation->set_rules('body', 'Body', 'required|min_length[2]');

        if ($this->form_validation->run() == TRUE) {

            if ($this->upload->do_upload('userfile')) {

                $data = $this->upload->data(); // Get the file data
                $fileData[] = $data; // It's an array with many data
                // Interate throught the data to work with them
                foreach ($fileData as $file) {
                    $file_data = $file;


                $this->db->insert('entries', array(
                    // So you can work with the values, like:
                    'title' => $this->input->post('title', true), // TRUE is XSS protection
                    'body' => $this->input->post('body', true),
                    'file_name' => $file_data['file_name'],
                    'file_ext' => $file_data['file_ext'],

                $this->session->set_flashdata('success', 'Form submitted successfully');
            } else {
                $this->session->set_flashdata('error', $this->upload->display_errors());
        } else {
            $this->session->set_flashdata('error', validation_errors());

You can use var_dump to see available data to work, or see the documentation (on the bottom)


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download