Codeigniter:显示每个帖子的帖子缩略图

时间:2014-10-31 19:40:52

标签: php codeigniter

我正在尝试设置演示博客,我希望每个帖子都有缩略图。首先看一下博客: my demo blog 。我可以在此处 creating new post 创建新的博文,并在博客中成功展示。我还有可以上传图片的图库页面,请点击此处: gallery page 。但我希望新的帖子页面有图片上传选项,它应该为我从新帖子页面发布的每个帖子添加一个图像,如下所示: example 。我怎么能这样做?我已经尝试了很多次,但未能在每个帖子中显示图像。

帖子模型:      

class Post extends CI_Model
{


    function get_posts($num=20, $start=0) {

        $this->db->select()->from('posts')->where('active',1)->order_by('date_added', 'desc')->limit(20,0);
        $query = $this->db->get();


        return $query->result_array();
    }

    function get_posts_count() {
            $this->db->select('postID')->from('posts')->where('active', 1);
            $query = $this->db->get();
            return $query->num_rows();
        }

    function get_post($postID) {
            $this->db->select()->from('posts')->where(array('active'=>1, 'postID'=> '$postID'))->order_by('date_added', 'desc');
            $query = $this->db->get();
            return $query->first_row('array');
        }

    function insert_post($data) {

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

 }

邮寄控制器:      

 class Posts extends CI_Controller
{
function __construct() {
    parent::__construct();
    $this->load->model('post');
    $this->load->helper('form');
    }

function index($start=0) {
        $data['posts']=$this->post->get_posts(5, $start);
        $this->load->library('pagination');
        $config['base_url'] = base_url() . 'posts/index/';
        $config['total_rows'] = $this->post->get_posts_count();
        $config['per_page'] = 5;
        $this->pagination->initialize($config);
        $data['pages'] = $this->pagination->create_links();
        $this->load->view('header'); 
        $this->load->view('post_index',$data);
        $this->load->view('footer');
    }

function post($postID) {
        $data['post']= $this->post->get_post($postID);
        $this->load->view('post',$data);
    }
function new_post() {
        if ($_POST) {
            $data=array(
                'title'=> $_POST['title'],
                'post' => $_POST['post'],
                'active'=> 1

                );
            $this->post->insert_post($data);
            redirect(base_url().'posts/');
        } else {
            $this->load->view('new_post');
        }
    }

 }

索引页面视图:显示所有博客帖子的位置:

    <?php 
        if (!isset($posts)) {
     ?>
     <p>there is currently no post in the database</p>
     <?php 
    } else {
        foreach ($posts as $row) {
      ?>
     <h2 class="title"><a class="link_title" href="<?php echo base_url()?>posts/post/<?echo $row['postID']?>"><?php echo $row['title']?></a><a class="edit" href="<?php echo base_url()?>posts/editpost/<?echo $row['postID']?>">Edit</a> / <a class="delete" href="<?php echo base_url()?>posts/<?echo $row['postID']?>">Delete</a></h2>
     <p><?php echo substr(strip_tags($row['post']),0,200) . ".."?></p>
     <p><a href="<?php echo base_url()?>/posts/post/<? echo $row['postID']?>">Read more</a></p>
      <hr>

      <?php 
            }
        }
       ?>

       <?php echo $pages; ?>

这是新的帖子页面视图,我想要提供图片上传选项:

  <form action="<?php echo base_url()?>posts/new_post" method="post">
            <p>Title: <input name="title" type="text"></p>
            <p>Description: <br><textarea name="post" cols="50" rows="30"></textarea></p>
            <p><input type="submit" value="Add Post"></p>
        </form>

我还有一些代码可以将图片上传到厨房页面。如果有帮助,我会分享这个。

图库模型:      

class Gallery_model extends CI_Model
 {
 var $gallery_path;
 var $gallery_path_url;

 function __construct()
 {
    parent::__construct();

    $this->gallery_path = './images';
    $this->gallery_path_url = base_url() . 'images/';

  }     


 function do_upload() {
        $config = array(
            'allowed_types' => 'jpg|png|jpeg',
            'upload_path'   =>  $this->gallery_path
            );
        $this->load->library('upload', $config);
        $this->upload->do_upload();
        $image_data = $this->upload->data();


        $config = array(
            'source_image' => $image_data['full_path'],
            'new_image'    => $this->gallery_path . '/thumbs',
            'maintain_ratio' => true,
            'width' => 150,
            'height' => 75
            );
        $this->load->library('image_lib', $config);
        $this->image_lib->resize();

    }
    function get_images() {
            $files = scandir($this->gallery_path);
            $files = array_diff($files, array('.', '..', 'thumbs'));

            $images = array();

            foreach ($files as $file) {
                $images[] = array(
                    'url' => $this->gallery_path_url . $file,
                    'thumb_url' => $this->gallery_path_url . 'thumbs/' . $file
                    );
            }

            return $images;
        }
  }

图库控制器:      

 class Gallery extends CI_Controller
{

function index() {
    $this->load->model('Gallery_model');
        if ($this->input->post('upload')) {
            $this->Gallery_model->do_upload();
        }

        $data['images'] = $this->Gallery_model->get_images();
        $this->load->view('header');
        $this->load->view('gallery', $data);
        $this->load->view('footer');
    }
 }

图库视图:

  <div class="gallery">

<?php if (isset($images) && count($images)): 
        foreach ($images as $image): ?>
            <div class="thumbs">
                <a href="<?php echo $image['url']; ?>">
                    <img src="<?php echo $image['thumb_url']; ?>" alt="">
                </a>
            </div>
        <?php endforeach; else: ?>
     <div class="blank_gallery">Please upload some pictures here</div>
    <?php endif; ?>
   </div>



 <div class="upload">
<?php 
echo form_open_multipart('gallery');
echo form_upload('userfile');
echo form_submit('upload', 'Upload');
echo form_close();

?>

如何将此图库页面代码与 new post page 页面一起使用,以便每个帖子都有缩略图。

我正在学习php。不知道如何解决这个问题。请帮帮我。

1 个答案:

答案 0 :(得分:0)

也许我不明白你的问题,但我可以认为你需要这个插件:

[http://jquery.malsup.com/form][1]
[Example at : http://jquery.malsup.com/form/progress.html][2]

这可以帮助您先上传图片然后编辑/保存文章,因为您的“图库页面”只会保存并上传图片,您需要将这2页与此ajax图片插件相关联。