1

I've been looking around for a way to filter my posts on http://www.waziproject.com/wazimagazine/ without reloading the page.

So my question is if anyone can help me out to turn the following into a list of filters that don't require refresh/reload of the page...

I believe the following answer is the closest I can get to a solution: Using ajax on categories and wordpress loops

However, I'm not sure where to implement the code. I'm using the following in my loop.php:

<div id="queryMenu">
<ul>
    <li><a href="#" id="business_work">Business & Work</a></li>
    <li><a href="#" id="development_sustainability">Development & Sustainability</a></li>
    <li><a href="#" id="education">Education</a></li>
    <li><a href="#" id="health_medecine">Health & Medecine</a></li>
    <li><a href="#" id="human_rights">Human Rights</a></li>
    <li><a href="#" id="law_order">Law & Order</a></li>
    <li><a href="#" id="media_information">Media & Information</a></li>
    <li><a href="#" id="nations">Nations</a></li>
    <li><a href="#" id="political_economy">Political Economy</a></li>
    <li><a href="#" id="research_innovation">Research & Innovation</a></li>
    <li><a href="#" id="reset">All Posts</a></li>
</ul>

Now if I want to apply the coding as mentioned here - Using ajax on categories and wordpress loops - where should I put the different code snippets and is there a lot of tweaking to be done to it?

Thank you very much in advance for your help!

-1

A piece of javascript/jquery:

$("#queryMenu ul li a").click(function(){
    var currentCategory = $(this).attr('id');
    $.ajax({
        type: 'post',
        url: 'ajax-category.php', //sometimes I'm using bloginfo to get current path: url: '<?php bloginfo('template_url'); ?>/ajax.php',
        data: {
            currentCategory: currentCategory
        },
        success: function(data) {
            console.log(data);
        }
    });
});

Put right path in url. Use $_REQUEST['currentCategory'] inside ajax-category.php to get category ID...

| improve this answer | |
  • Your selector is not efficiently.jquery is trying to find right to left. a - li - ul..... – ahmetlutfu Apr 5 '14 at 20:44
  • this is not the way to do ajax in wordpress – Mark Kaplun May 2 '17 at 20:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.