jQuery UI的“可选” - 需要调用Codeigniter模型函数

(原始问题( 我正在使用jquery ui的可选脚本来控制我的Web应用程序中的特定活动关键字。在此处查看：供参考 www.rickymason.net/letschat/main/home

我对javascript的经验很少，我正在尝试弄清楚如何启动我主模型中的函数。

基于答案的更新功能：

我已经更新了我的代码以支持新的 JSON/AJAX 格式。这要求我创建一个活动/非活动会话筛选器，以便用户可以正常添加筛选器，并始终使用 AJAX 更新线程列表。这对我来说更有意义。

这是我目前拥有的代码，它仍然不起作用。 我试图做到这一点，当用户单击可选类别(通过 Jquery UI(时，与选择关联的divID 将通过 AJAX 传递并返回一个更新div id ="board" 的线程列表数组。

这是我当前的控制器设置：

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;
?>

应用/主/显示过滤器.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>";
} ?>

$(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);
            }
        });
    }
});

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
    }
}

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