php - jquery ui の「選択可能」 - codeigniter モデル関数を呼び出す必要があります

Question

(元の質問) webapp で特定のアクティブなキーワードを制御するために、jquery ui の選択可能なスクリプトを使用しています。こちらをご覧ください: www.rickymason.net/letschat/main/home参照

私は JavaScript の経験がほとんどなく、メインモデルにある関数を起動する方法を理解しようとしています。

回答に基づいて更新された関数:

新しい JSON/AJAX 形式をサポートするようにコードを更新しました。これには、ユーザーが通常どおりフィルターを追加し、常に AJAX を使用してスレッドリストを更新できるように、アクティブ/非アクティブセッションフィルターを作成する必要がありました。これは私にとってより理にかなっています。

ここに私が現在持っているコードがありますが、まだ機能していません。ユーザーが（Jquery UIを介して）選択可能なカテゴリをクリックすると、選択に関連付けられたdivIDがAJAXを介して渡され、div id = "board"を更新するthreadlist配列が返されるようにしようとしています。

これが私の現在のコントローラーのセットアップです：

public function home($page = 'home')
    {
        $data['user_id'] = $this->tank_auth->get_user_id();
        $data['username'] = $this->tank_auth->get_username();
        $data['threads'] = $this->thread_model->session_load();
        $data['title'] = ucfirst($page); // Capitalize the first letter
        $data['page'] = $page;
        $this->load->view('templates/head', $data);
        $this->load->view('templates/nav', $data);
        $this->load->view('main/newthread', $data);
        $this->load->view('main/addfilter', $data);
        $this->load->view('main/checkbox', $data);
        $this->load->view('main/displayfilter',$data);
        $this->load->view('main/board', $data);
        $this->load->view('templates/footer');
    }

    public function updatefilters($filters)
    {
        $filterarray = split("|", $filters);
        $this->thread_model->create_session_filter($filterarray); 
        $threadarray = $this->thread_model->get_threads();
        $data['json'] = '{"content":' + $threadarray + '}';
        $this->load->view('json_view', $data); // See step 4!!!
    }

ここに私の現在のモデルコードがあります:

    public function get_threads()
    {
            $filter = $this->session->userdata('filter');
            $num_tags = count($filter);
            if ($num_tags > 0 && $num_tags <= 8) {
                $sql_select = "SELECT DISTINCT t.* ";
                $sql_from = " FROM ";
                $sql_where = " WHERE ";
                $sql_joins = "";
                $sql_order = "ORDER BY t.timestamp DESC";
                for ($i=0;$i<$num_tags;++$i) {
                    if ($i==0) {
                    $sql_from .= " filter AS f ";
                    $sql_where .= " f.tag LIKE '%" . $filter[0] . "%'";
                    $sql_joins .= " INNER JOIN filter_thread AS ft ON ft.filter_id = f.filter_id
                                    INNER JOIN thread AS t ON ft.thread_id = t.thread_id";
                    }
                    else {
                    $sql_where .= " OR f.tag LIKE '%" . $filter[$i] . "%'";
                    }
                }
            } else {
                break; 
            }
            $sql = $sql_select . $sql_from . $sql_joins . $sql_where . $sql_order;

            $query = $this->db->query($sql);
            $thread = $query->result_array();
        return json_encode($thread); //I am aware this is not correct
    }

    public function create_session_filter($filterstring)
    {
        $filterarray[] = $filterstring;
        $filter['filter'] = $filterarray;
        if ($this->session->userdata('filter') == TRUE) {
            $sessionfilter = $this->session->userdata('filter');
            $new = array_merge($sessionfilter, $filter['filter']);
            $this->session->unset_userdata('filter');
            $filter['filter'] = $new;
            $this->session->set_userdata($filter);
        } else {
            if (!$filterstring) {} else {
            $this->session->set_userdata($filter);
            }
        }
    }

    public function create_session_inactive_filter($filterstring)
    {
        $filterarray[] = $filterstring;
        $filter['inactivefilter'] = $filterarray;
        if ($this->session->userdata('inactivefilter') == TRUE) {
            $sessionfilter = $this->session->userdata('inactivefilter');
            $new = array_merge($sessionfilter, $filter['inactivefilter']);
            $this->session->unset_userdata('inactivefilter');
            $filter['inactivefilter'] = $new;
            $this->session->set_userdata($filter);
        } else {
            if (!$filterstring) {} else {
            $this->session->set_userdata($filter);
            }
        }
    }

そして、ここに私の現在のビューコードがあります:

アプリケーション/メイン/json_view.php

<?php
header("Content-Type: application/json");
echo $json;
?>

アプリケーション/メイン/bdisplayfilter.php

<script>
    $(function() {
        $( "#selectable" ).selectable({
            selected: updateFilters,
            unselected: updateFilters
        });
        function updateFilters(ev, ui){    
        alert ("hello");
        // get the selected filters
        var $selected = $('#selectable').children('.ui-selected');
        // create a string that has each filter separated by a pipe ("|")
        var filters = $selected.map(function(){return this.id;}).get().join("|");
        $.ajax({
            url: '/main/updateFilters', //see step 2
            data: { filters: filters },
            success: function(data){
                // data is whatever json you decide to return from the server.
                // An easy way to do things is have data look like this:
                // { content: "<div>All my new threads that I want to show up</div>" }
                // then, you can replace some element on the page with the new content
                // For example, say your container has an id of threadContainer:
                $('#select').replaceWith(data.content);
            }
        }); }
    });
</script>
<ol id="selectable">
    <li class="ui-state-default" id="everything">Everything!</li>
    <li class="ui-state-default" id="entertainment">Entertainment</li>
    <li class="ui-state-default" id="sci/tech">Sci/Tech</li>
    <li class="ui-state-default" id="news">News</li>
    <?php 

    if ($this->session->userdata('inactivefilter') == true) {
            $inactivefilter = $this->session->userdata('inactivefilter');
            foreach ($inactivefilter as $new)
                {
                    echo "<li class='ui-state-default' id='custom'>$new</li>";
                }
        }
    ?>
</ol>
<?php
if ($this->session->userdata('inactivefilter') == true) {
echo "<form action='".base_url()."main/clear_filter'><input type='submit' value=clear></form>";
} ?>

score 3 · Accepted Answer

編集: ajax 呼び出しの URL 部分とデータ部分を更新し、クエリ文字列パラメーターを有効にする手順を追加しました。

1) AJAX 呼び出しを行う

複数のフィルターを使用でき、両方のイベントに応じて更新する必要があるため、選択されたものと選択されていないものに対して同じ呼び出しを行う必要があります。そこで、両方のイベントが呼び出すことができる共通の関数を定義します。

$(function() {
    $( "#selectable" ).selectable({
        selected: updateFilters,
        unselected: updateFilters
    });   
    function updatefilters(ev, ui){
        // get the selected filters
        var $selected = $('#selectable').children('.ui-selected');
        // create a string that has each filter separated by a pipe ("|")
        var filters = $selected.map(function(){return this.id;}).get().join("|");
        $.ajax({
            url: '/index.php',
            data: { c: main, m: updateFilters, filters: filters },
            success: function(data){
                // data is whatever json you decide to return from the server.
                // An easy way to do things is have data look like this:
                // { content: "<div>All my new threads that I want to show up</div>" }
                // then, you can replace some element on the page with the new content
                // For example, say your container has an id of threadContainer:
                $('#threadContainer').replaceWith(data.content);
            }
        });
    }
});

2) application/config.php でクエリ文字列パラメーターを有効にします。

この記事の下部にある「クエリ文字列を有効にする」というセクションで、その方法について説明しています: http://codeigniter.com/user_guide/general/urls.html

3) フィルターを受け取るアクションを作成する

Page という名前のコントローラーを使用していることに注意してください (これは /application/controllers/page.php にあります)。このアクション (updateFilters) は、任意のコントローラーに含めることができます。

class Page extends CI_Controller {

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

    function index()
    {
    }

    function updateFilters($filters)
    {
        $filterarray = split("|", $filters);
        create_session_filter($filterarray); 

        $articlesHTML = getThreadList($filterarray); // See step 4!!!
        $data['json'] = '{"content":' + $articlesHTML + '}';
        $this->load->view('json_view', $data); // See step 5!!!
    }

    /* I've updated this slightly to accept an array */
    public function create_session_filter($filterarray)
    {
        $filter['filter'] = $filterarray;
        //... the rest of your stuff you already had
    }
}

4) getThreadList メソッドを実装する

このためにすでに何かを設定している場合、あなたは言及していないと思います。これは基本的にフィルターの配列を取り、それに基づいてスレッドリストをレンダリングします。

5) json_view を作成します (まだ存在しない場合)

これにより、ブラウザーがコンテンツが json であることを認識できるように、コンテンツタイプが設定されます。

/application/views/json_view.php で:

<?php
header("Content-Type: application/json");
echo $json;
?>

php - jquery ui の「選択可能」 - codeigniter モデル関数を呼び出す必要があります

1 に答える 1

Related

Reference