javascript – 用PHP上的jQuery ajax函数更新div内容

我试图通过使用jQuery中的.ajax()函数将两个输入字段的值发送到PHP文件(search_value.PHP)来更新我的div内容(#update_div).

如果我只是使用html表单POST方法重定向输入字段的两个值,它可以工作.所以search_value.PHP应该是正确的.

我的HTML代码：

<form id="my_form">
  <input id="food" name="food">
  <input id="amount" value="amount in gram" name="amount">
  <input type="button" value="Update" id="submit" name="submit" />
</form>

<div id="update_div">
</div>

我的Javascript代码：

$("#submit").click(function() {
  var food = $("#food").val();
  var amount = $("#amount").val();
  $.ajax({
    url: 'search_value.PHP',
    type: 'GET',            
    data: {"food":food,"amount":amount},
    success: function(data)
    {
      $('#update_div').html(data);
    }
  });
});

我的PHP代码：

<?PHP
  $pdo = new PDO('MysqL:host=localhost;dbname=calotools', 'root', '');

  $food = $GET_['food'];
  $amount = $GET_['amount'];

  $query="SELECT * FROM nahrungsmittel WHERE name = '$food'";

  $user = $pdo->query($query)->fetch();
  echo $user['name']."<br />";
  echo $user['kcal'] / 100 * $amount;
?>

单击按钮,我真的没有得到反馈.也许你们可以告诉我为什么？

解决方法:

对于GET请求,不应该有数据部分,将其作为查询字符串,如下面的js代码：

$("#submit").click(function() {
   var food = $("#food").val();
   var amount = $("#amount").val();
   $.ajax({
   url: 'search_value.PHP?food='+ food + '&amount='+amount,
   type: 'GET',
   datatype: "html",   
   success: function(data)
   {
     $('#update_div').html(data);
   },
   failure : function(ex)
   {
      console.log(ex);
   }
  });
});

并在PHP中使用$_GET而不是$GET_