Сообщение AJAX на PHP пусто

Question

Я проверил другие вопросы - это не дубликат. Я пробовал все решения, которые я мог найти и реализовать.

Я пытаюсь отправить данные из task.php → showCats.php

task.php:

<script type="text/javascript"> 

    $(document).on("click", ".btnCat", function() { 
     var filter = $(this).data("id"); 

     alert(filter); 
     $.ajax({ 
      type: 'POST', 
      url: 'showCats.php', 
      data: {'filter': filter}, 
     }); 
     $('div.container-fluid').load('showCats.php'); 
    }); 

</script> 

showCats.php:

$area = $_POST['filter']; 

$sql = "select AID,name,surname,street_name,house_number, area, plz,poster,visible from addresses WHERE area LIKE '$area' AND visible LIKE 'show' ORDER BY AID DESC"; 
$rs = mysqli_query($con,$sql); 
$str = ''; 

while ($res = mysqli_fetch_array($rs)) { 
    $str .= ' 
    <div class="col-md-9"> 
     <div class="task col-md-12 well" id='.$res['AID'].'> 
      <div> 
       <button class="btn btn-danger btn-xs btnDelete" id='.$res["poster"].' onclick="refresh()" data-id="'.$res['AID'].'">x</button> 
      </div> 
      <div> 
       <span>'. $res["name"].'</span> 
       <span>'. $res["surname"].'</span><br> 
       <span>'. $res["street_name"].'</span> 
       <span>'. $res["house_number"].'</span><br> 
       <span>'. $res["plz"].'</span> 
       <span>'. $res["area"].'</span> 
      </div> 
     </div> 
    </div>'; 
} 

echo $str; 
?> 

var_dump($_POST); возвращается NULL, даже если Я вижу значение столбца в разделе Инструменты разработчика в Chrome.

Мой GET:

Request URL:https://example.com/showCats.php 
Request Method:GET 
Status Code:200 OK 
Remote Address:xxx:443 
Response Headers 
view source 
Cache-Control:no-store, no-cache, must-revalidate, post-check=0, pre-check=0 
Connection:keep-alive 
Content-Encoding:gzip 
Content-Type:text/html; charset=UTF-8 
Date:Fri, 15 Jul 2016 18:43:56 GMT 
Expires:Thu, 19 Nov 1981 08:52:00 GMT 
Pragma:no-cache 
Server:nginx/1.6.2 
Strict-Transport-Security:max-age=31536000 
Transfer-Encoding:chunked 
Request Headers 
view source 
Accept:text/html, */*; q=0.01 
Accept-Encoding:gzip, deflate, sdch, br 
Accept-Language:en-US,en;q=0.8,de;q=0.6 
Connection:keep-alive 
Cookie:PHPSESSID=vudgbb33574tfod2vu48hst830 
Host:example.com 
Referer:https://example.com/tasks.php 
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36 
X-Requested-With:XMLHttpRequest 

Мой пост:

Request URL:https://example.com/showCats.php 
Request Method:POST 
Status Code:200 OK 
Remote Address:xxx:443 
Response Headers 
view source 
Cache-Control:no-store, no-cache, must-revalidate, post-check=0, pre-check=0 
Connection:keep-alive 
Content-Encoding:gzip 
Content-Type:text/html; charset=UTF-8 
Date:Fri, 15 Jul 2016 18:43:56 GMT 
Expires:Thu, 19 Nov 1981 08:52:00 GMT 
Pragma:no-cache 
Server:nginx/1.6.2 
Strict-Transport-Security:max-age=31536000 
Transfer-Encoding:chunked 
Request Headers 
view source 
Accept:*/* 
Accept-Encoding:gzip, deflate, br 
Accept-Language:en-US,en;q=0.8,de;q=0.6 
Connection:keep-alive 
Content-Length:12 
Content-Type:application/x-www-form-urlencoded; charset=UTF-8 
Cookie:PHPSESSID=vudgbb33574tfod2vu48hst830 
Host:example.com 
Origin:https://example.com 
Referer:https://example.com/tasks.php 
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36 
X-Requested-With:XMLHttpRequest 
Form Data 
view source 
view URL encoded 
filter:Turgi 

Answer 1

Вы пытаетесь отправить данные из task.php -> showCats.php! ваш код делает это очень хорошо с помощью этого:

$.ajax({ 
    type: 'POST', 
    url: 'showCats.php', 
    data: {'filter': filter}, 
}); 

Проблема заключается в том, когда вы делаете это: $('div.container-fluid').load('showCats.php');GET запрос будет отправлен на сервер! так что это нормально, чтобы найти var_dump($_POST) return NULL.

Если вы хотите, чтобы показать/получить ответ, вы можете использовать success событие, как это:

$.ajax({ 
    type: 'POST', 
    url: 'showCats.php', 
    data: {'filter': filter}, 
    //A function to be called if the request succeeds. 
    success: function(data) { 
     $('div.container-fluid').html(data) 
    }, 
    //A function to be called if the request fails 
    error: function(xhr, status, error) { 
     alert('An error occurred:'+error); 
    } 
}); 

Answer 2

настройки параметра типа данных указывает, какие данные вы отправляете.

type: "POST", 
dataType: 'json', 

Я согласен с этими комментариями выше. Загрузка программы во второй раз не сообщает значения вызова базы данных. Кроме того, не будет ли AJAX нормально возвращать значения вызывающей программе с помощью эха json_encode вместо того, чтобы просто отсылать переменную к запуску страницы PHP, которая не просматривается?