How to upload an image on CodeIgniter and display it on another page

Question

i am still learning the codeigniter framework and just completed the news application tutorial, which lets you create a news item with a title and some text for the story. how can i get the user to be able to upload an image with the news item, and display each image when viewing the corresponding news item.

ps. sorry if i made any mistakes, this is my first question

create.php

<h2>Create a news item</h2>

<?php echo validation_errors(); ?>

<?php echo form_open('news/create') ?>

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

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

    <label for="title">Title</label>
    <input type="input" name="title" /><br />

    <label for="text">Text</label>
    <textarea name="text"></textarea><br />

    <input style="margin-left: 18%; margin-right: 20%;" type="submit" name="submit" value="PUBLISH" />

</form>

news_model.php

    <?php
class News_model extends CI_Model {

    public function __construct()
    {
        $this->load->database();
    }

public function get_news($slug = FALSE)
{
    if ($slug === FALSE)
    {
        $this->db->order_by("id", "desc");
        $query = $this->db->get('news');


        return $query->result_array();
    }

    $query = $this->db->get_where('news', array('slug' => $slug));
    return $query->row_array();
}
public function set_news()
{
    $this->load->helper('url');

    $slug = url_title($this->input->post('title'), 'dash', TRUE);

    $data = array(
        'title' => $this->input->post('title'),
        'slug' => $slug,
        'text' => $this->input->post('text')
    );

    return $this->db->insert('news', $data);
}
}

news.php -Controller

<?php
class News extends CI_Controller {

    public function __construct()
    {
        parent::__construct();
        $this->load->model('news_model');
    }

    public function index(){
        $data['news'] = $this->news_model->get_news();
        $data['title'] = 'News archive';
        $this->load->view('templates/header', $data);
        $this->load->view('templates/rightpane', $data);
        $this->load->view('news/index', $data);
        $this->load->view('templates/footer');
    }


public function view($slug)
{
    $data['news_item'] = $this->news_model->get_news($slug);        

    if (empty($data['news_item']))
    {
        show_404();
    }

    $data['title'] = $data['news_item']['title'];

    $this->load->view('templates/header', $data);
    $this->load->view('templates/rightpane', $data);
    $this->load->view('news/view', $data);
    $this->load->view('templates/footer');
}
public function create()
{
    $this->load->helper('form');
    $this->load->library('form_validation');

    $data['title'] = 'Create a news item';

    $this->form_validation->set_rules('title', 'Title', 'required');
    $this->form_validation->set_rules('text', 'text', 'required');

    if ($this->form_validation->run() === FALSE)
    {
        $this->load->view('templates/header', $data);
        $this->load->view('templates/rightpane', $data);
        $this->load->view('news/create');
        $this->load->view('templates/footer');

    }
    else
    {
        $this->news_model->set_news();
        $this->load->view('news/success');
    }
}
}

view.php

<?php
echo '<h2>'.$news_item['title'].'</h2>';
echo $news_item['text'];`

index.php

<?php foreach ($news as $news_item): ?>
    <div style="margin-left: 18%; margin-right: 20%;">
    <h2 ><?php echo $news_item['title'] ?></h2>
    <div id="main" >
        <?php echo $news_item['text'] ?>
    </div>
    <p ><a href="news/<?php echo $news_item['slug'] ?>">View article</a></p>
    </div>
<?php endforeach ?>

Answer 1

Take a look at the upload class from the docs :

http://ellislab.com/codeigniter/user-guide/libraries/file_uploading.html

hint : you'll save the file to server and then save the URL in the database, then you can display the URL inside an IMG tag.

Answer 2

The solution is: img src="" class="img-responsive"