2

序章:

ファイル名のリストを格納するデータベースがあります。これらのファイル名は、フォルダー user_data 内の画像に対応しています。

私の Codeigniter ディレクトリ構造は次のようになります。

-application
-system
-assets
-user_data

データベースは次のようになります。

CREATE TABLE `files` (
  `id` int NOT NULL AUTO_INCREMENT PRIMARY KEY,
  `filename` varchar(255) NOT NULL,
  `title` varchar(100) NOT NULL
);

私が達成しようとしていること:

Ajax を使用して非同期的にデータベース内のすべてのファイル名を取得し、そのファイル名を使用してすべての画像を小さなギャラリーに表示したいと考えています。これは、ページを更新せずに行うことが重要です。


これまでの私のコード:

コントローラ

class Create extends CI_Controller {

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

    public function index()
    {
        $this->load->view('create', $data);
    }

}

意見

<div id='gallery'> <!-- images will be displayed in here -->                

</div>

<!-- gallery should be updated when submit is clicked -->
<button id="update">Click to load images</button>

私が欲しいのは、データベースに表示されているすべての画像が、ユーザーが更新をクリックしたときにギャラリーに表示されることです。

これを処理する JS 関数の作成をどのように開始すればよいですか? 私はこれを実行し、MVC パターンを尊重したいと考えています。

Codeigniter と MVC は初めてで、これを行うためのモデルとコントローラーを正しく構築する方法がわかりません。

どんな助けでも大歓迎です。

4

2 に答える 2

1

あなたのこれを試してみてくださいview page

ただし、最初にまたはを追加jqueryしますheader fileyour view

PHP

<?php
class Model_name extends CI_Model {

    public function __construct()
    {
        parent::__construct();
    }
    /* Model code */
    function get_image_list(){
        $sql = sprintf("SELECT * FROM <table>");
        $query = $this->db->query($sql);
       return $query->result();
    }
 }

/*  Controller Code */

function update_gallery()
{
    $this->load->model('Model_name');
    $result = $this->Model_name->get_image_list();
    $str='';
    foreach($result as $row){
        $str.='<img src="'.$row['filepath'].'" alt="'.$row['title'].'" />';
    }
    echo $str;  
}

?>

JAVASCRIPT

$(document).ready(function()
    $('#update').on('click',function(){
       $.ajax({
          url:'yourpagecontroller',
          type:'GET',
          success:function(data){
          // let data comes like: <img src="path.jpg" alt="Name of image" /><img .../>, etc
             $('#gallery').html(data);
          }
       })
    });
});
于 2013-03-12T09:48:53.757 に答える
1

すべてを書き出す時間はありませんが、次のようなものが機能するはずです。

class Create extends CI_Controller {
        public function __construct()
    {
        parent::__construct();
        $this->load->model('files');
    }

    public function index()
    {
        $this->load->view('create', $data);
    }

    public function get_files()
    {
        echo json_encode($this->files->get_files());
    }
}

class Files extends CI_Model
{
    public function get_files()
    {
        return $this->db->query("SELECT * FROM files")->result_array();
    }
}


$(document).ready(function()
    $('#update').on('click',function(){
       $.ajax({
          url:'/create/get_files',
          type:'GET',
          success:function(result){
             var data = jQuery.parseJSON(result);

            // Loop through 'data' and append to the DOM

          }
       })
    });
});
于 2013-03-12T10:01:06.423 に答える