Filter entries by ajax to controller

Question

Short story: I need your help sending value from dropdown selection as data to controller so my div updates with the filtered entries based on the selection.

Long story and code: I have a listing of entries in my template as follows:

{% for entry in craft.entries.section('live').find() %}
    <li><a href="{{ entry.url }}">{{ entry.title }}</a></li>
{% endfor %}

I know I can filter those results with a field handle by updating the first line above with:

{% for entry in craft.entries.section('live').hostSite('weDo').find() %}

However I'd like to filter that listing of entries with a dropdown list that contains the available field handles, ie 'weDo, 'theyDo':

<select class="filter">
    <option value="all">all sites</option>
    <option value="weDo">sites we host</option>
    <option value="theyDo">sites they host</option>
</select> 

I'd like to do this with Ajax and a controller I set up:

**Javascript**
// Add an event listener for filter clicks
$(function () {
    $('body').on('change', 'select.filter', onFilterClick);
});

// Event handler for the filter click
function onFilterClick (e)
{
    e.preventDefault();
    var data = this.value;

    $.ajax({
        method: 'get',
        url: 'actions/websiteListing/checkStatus',
        data: data,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    })
    .success(function(data) {
        $('.livelisting').html(data);
    })
    .error(function(data) {
        console.log('error', data);
    }); 
}
**Controller**
<?php
namespace Craft;

class WebsiteListingController extends BaseController
{
    protected $allowAnonymous = true;

    public function actionCheckStatus()
    {
        $criteria = craft()->elements->getCriteria(ElementType::Entry);
        $criteria->section('live');
        $criteria->hostSite = 'weDo';
        $criteria->limit = null;

        $entries = $criteria->find();

        foreach ($criteria as $entry) {
            echo $entry->title . '<br>';
        }
    }
}

I know the ajax is pretty trashy, but the url to the controller file is working correctly because when I make a selection from the dropdown menu, my div.livelisting is replaced by the single entry available with the field handle of 'weDo'.

Here's where your help is needed! The 'weDo' value in my controller needs the data sent from Ajax. Thanks for your expertise.

Answer 1

I did a little more research on Ajax and found a solution. I updated my Ajax such that the data line looks like:

$.ajax({
    method: 'get',
    url: 'actions/websiteListing/checkStatus',
    data: {filter: data},
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})

Then in my controller, I was able to pass that data by adding $filter to the first line and including that for my 3rd $criteria line:

public function actionCheckStatus($filter)
{
    $criteria = craft()->elements->getCriteria(ElementType::Entry);
    $criteria->section = ('live');
    $criteria->hostSite = $filter;
    $criteria->limit = null;

    $entries = $criteria->find();

    foreach ($criteria as $entry) {
        echo $entry->title . '<br>';
    }
    die();
}