使用ajax完成我的搜索输入


finish my search input using ajax

我知道我已经发布了大约30分钟,但我想我已经接近我的搜索帖子输入:

我创建了一个看起来像的模型

    function matchPosts($keyword)
{
    $this->db->get('posts');
    $data = array();
    $query = $this->db->query("SELECT title,body FROM posts WHERE title LIKE '%$keyword%' or body LIKE '$keyword%' AND status='published'");        
    if( $query->num_rows() > 0)
    {
        $data = $query->row_array();
    }       
    $query->free_result();
    return  $data;
}

我正试图从我的数据库中获取匹配项

控制器看起来像这样:

public function searchPosts()
{
    $keyword = $this->input->post('search_value', TRUE);
    $matched_field = $this->Model_cats->matchPosts($keyword);
    echo $keyword;
    if( count($matched_field) > 0)
    {
        $this->load->view('posts_list');
    }
    else
    {
        $this->load->view('posts_list');
    }
}

这是js文件

$(document).ready(function()
{
    $("#search_posts").keyup(function()
    {        
        var searchValue = $(this).val();
        $(".posted_post").each(function()
        {
               $.ajax({             
                    type: "POST",
                    url : "http://local.blog.com/welcome/searchPosts",
                    data: {
                        search_value: searchValue   
                    },  
                    success: function(data)
                    { 
                        if(data)
                        {
                            $(this).show(); 
                        }
                        else
                        {
                            $(this).fadeOut();      
                        }
                    }
                });
        });
    });
});

和视图:

    <br>    
<form action="" method="post"> 
        <label for="search_posts"><b>Search Posts</b></label>
        <input type="text" id="search_posts" value="" />
</form>


postst_list是我循环浏览帖子的视图。。。

我快到了吗?它在这种状态下不起作用。

在match_posts函数中,您使用的是num_rows()在您的searchposts函数中,您正在从上面的函数中收集结果,并使用===与布尔值true进行比较。尝试var dump来确认从num rows函数返回的值的类型。我认为你在比较数值和布尔值。相反,您可以使用if count(匹配字段)>0

将脚本编辑为

$("#search_posts").keyup(function()
{        
    var posts = $(this).val();        
    //$(".posted_post").each(function()
    //{
        $.ajax({
            url : 'http://local.blog.com/welcome/searchPosts',
            data: {posts},  
            success : function(data)
            {
                 $(this).show();
            }
        });
    //}
});

$matched_field = $this->Model_cats->matchPosts($keyword);

$matched_field返回正确找到的搜索结果的数目。。??然后你就像一样检查

if($matched_field)
{
      //Here you can print result of search
}
else
{
      //You can print No results found
}

型号

class SomeModel extends CI_Model{
    /**
     * Get Posts
     * 
     * @param string LIKE param
     * @return mixed Object/Array or Boolean
     **/
    public function get_posts( $like ){
        $query = 
        $this->db
             ->select('id, title, body')
             ->like('title'   => $like)
             ->or_like('body' => $like) //not sure if your looking for FULLTEXTSEARCH on this body
             ->get_where('posts', array('status' => 'published'));

        return ( $query->num_rows() > 0) ? $query->result() : FALSE;
    }
}

路线

//edit to match your class/method
$route['search/(:any)'] = 'welcome/search_posts/$1';

控制器

class Welcome extends CI_Controller{
    public function search_posts( $like ){
        if( !$posts = $this->SomeModel->get_posts( $like ))
        {
            return show_404();
        }
        //return partial view without template
        return $this->load->view('public_home', array(
            'posts' =>  $posts
        ), TRUE);
    }
}

部分视图(针对ajax)

/**
<ul>
    //<?php foreach($posts as $post): ?>
    <li>
        <a href=#>
            <h4><?php echo html_escape($post->title) ?></h4>
            <p>
                <?php echo html_escape($post->body) ?>
            </p>
        </a>
    </li>
    //<?php endforeach; ?>
</ul>
**/

JQuery

var SITEURL = "<?php echo site_url(); ?>";
;(function($){
    var search = {
        init: function(){
            if($('#search_posts'))
            {
                this.searchPosts();
            }
        },
        searchPosts : function(){
            var searchInput = $("#search_posts")
                result      = $("#result"),
                timeout     = '';
            //ajax request
            var doAjax = function( context, data ){
                $.ajax({
                    cache    : false,
                    url      : SITEURL + 'search/' + data.keyword,
                    dataType : 'html',
                    type     : 'POST',
                    data     : data,
                    context  : context,
                    success  : function( callback ){
                        $(this).html( callback ); //$(this) = context => $("#result")
                    }
                });
            };
            //delayed keyup event
            searchInput.on('keyup', function( event ){
                if(timeout) {
                    window.clearTimeout(timeout);
                    timeout = null;
                }
                //listen for keyup after delayed(1000)
                timeout = window.setTimeout(function(){
                    var inputVal = $(this).val();
                    var data     = {
                        'keyword'   : inputVal
                    }
                    return doAjax( result, data );//execute ajax function
                }, 1000);
            });


        }
    };
    $(function(){
        search.init();
    });
})(jQuery);