无法通过AJAX获取PHP变量

Question

I am using Wordpress and I have a page where I have a drop down that when the links are clicked it will make an Ajax call and pass the data variable to PHP, at least that is what I'm attempting to do lol.

When clicking on the link I check my browser and in the Network tab for the page I receive a variable for the data object in the html and the ajax post's to the php page but for some reason I can't get a value.

My HTML

<div class="category-submenu">
    <ul>
        <li><a href="#" data-office="Corporate">Corporate</a></li>
        <li><a href="#" data-office="Office1">Office1</a></li>
        <li><a href="#" data-office="Office2">Office2</a></li>
        <li><a href="#" data-office="Office3">Office3</a></li>
    </ul>
</div>

My jQuery

$('.category-submenu a').click(function(){
    $.ajax({
        type: "POST",
        url: "/load-team.php",
        dataType: 'json',
        data: {office: $(this).data('office')},
        success: function(data) {
            $.each( data, function(i, item) {
                alert(data[i].start);
            });
        }
    });
});

My PHP

<?php

    $office = $_GET['office'];
    $link = mysql_pconnect("localhost", "root", "root") or die("Could not connect");

    mysql_select_db("somedb") or die("Could not select database");

    $arr = array();
    $query = mysql_query("SELECT first_name, last_name FROM ic_team_members WHERE office ='" . $office . "'");

    while($obj = mysql_fetch_object($query)) {
        $arr[] = $obj;
    }

    echo '{"members":'.json_encode($arr).'}';

 ?>

I'm sure there is some code missing or my syntax might be incorrect in some parts but I can't seem to find where, if any place.

Again I want to grab the data object from HTML element, pass it through Ajax into PHP and return the result as json object, which I can do but for some reason I think the error is in my PHP.

Any help would be appreciated.

Answer 1

You are passing it by POST, and therefore you need to receive it with POST:

$office = $_POST['office'];

Otherwise, use GET to send the ajax request:

$.ajax({
    type: "GET",
    ...

});