using ajax to search posts on my website

Question

Hello guys i am trying to create a search input that will search all my posts and display the matched ones:

I have an working code that looks like this:

html:

<form action="" method="post"> 
            <input type="text" id="search_posts" value="" />
    </form>

jquery:

$(document).ready(function()
{
    $("#search_posts").keyup(function()
    {        

        var posts = $(this).val();        

        $(".posted_post").each(function()
        {
            if ($(this).text().search( new RegExp(posts, "i") ) < 0) 
            {
                $(this).fadeOut();
            } 
            else 
            {
                $(this).show();
            }
        });
    });
});

but now i'm not doing any db search and stuff... can i transform this using ajax? how would that look?

possible duplicate of [jQuery AJAX POST example](http://stackoverflow.com/questions/5004233/jquery-ajax-post-example/14217926#14217926) — NullPoiиteя, Feb 18 '13 at 12:14
In general you'd start with an AJAX call to a server-side resource, using something like `$.ajax()`. That server-side resource would accept the search string and return the results. Then the client-side response handler for the AJAX call would get those results and display them. You probably wouldn't want to do this on the keyup event because it would be too chatty over the network and might behave incorrectly under even slight delays. Take a look at the jQuery autocomplete plugin for exactly this functionality. — David, Feb 18 '13 at 12:16

score 0 · Answer 1 · answered Feb 18 '13 at 12:19

0

Yes you can change this to using ajax, try it:

$(".posted_post").each(function()
{
$.ajax({
    url : 'yourphpfunction.php',
    data: {posts},  
    success : function(data){
         $(this).show();
    }
});
}

Now you need to make some php function to work with yous posts var value and return some thing to your phmtml.

Gl on that

answered Feb 18 '13 at 12:19

Guerra

2,792
1
22
32

1

If you're still looping through all of the posts then this implies that the posts are still client-side. What would the AJAX call even be accomplishing in that case? – David Feb 18 '13 at 12:24
Calling it "a PHP function" sounds a little misleading, too. A "page" might be more analogous. But "a function" could easily imply to a novice that the JavaScript code is actually executing a server-side PHP function (which is a _very_ common mistake). Whether it's a "function" or whether it even uses PHP at all is immaterial to the AJAX call. It just needs to be some server-side resource which responds to the request. – David Feb 18 '13 at 12:26

score 0 · Answer 2 · answered Feb 18 '13 at 12:20

If it's just passing ajax, please take a look here: [http://jqapi.com/#p=jQuery.post][1]

Your question is not clearly. That are you doing exactly? If you want to crawl your Database, then i would recommend you to build up any kind of REST Service for that, return the Result in JSON Format and then map it to an jQuery Object using

var i = $.map(result);

With this you can append a template to a ul list, for example by using $(object').each(function(item){ });

using ajax to search posts on my website

2 Answers2