使用JQuery獲取數據庫中行的其餘部分

Question

好吧，我有這個搜索框讓人們在食物項目中輸入。當他們按下按鈕時，我需要將該輸入發送到.php文件。該PHP文件將查找該食品的卡路里（在我的數據庫中），並輸出食品名稱和卡路里。所有這些都需要在不重新加載頁面的情況下完成，因此我開始瞭解JQuery的工作原理。

但是我被卡住了，我不知道應該把什麼放在jquery函數的數據字段中，以及如何'捕獲'.php文件中的數據。有人能給我一個想法嗎？非常感謝！ （請參閱我不明白的事情）。此外，返回的數據最終不需要在警告框中，但更新我的頁面上的某個表，我該如何做？哪些JSON（？）Jquery函數是否需要？

我有什麼到現在爲止：

<script type="text/javascript"> 
function contentDisp() 
{ 

$.ajax({ 
    type: 'POST', 
    url: 'getFood.php', 
    data: '????????', 
    success: function(data){ 
    alert("Data Loaded: " + data); 
    } 

}); 

} 
</script> 

和身體：

<form autocomplete="off"> 
     <p> 
      Product: 
      <input type="text" name="food" id="food" class="food_name_textbox" onmouseover="javascript: this.className='food_name_textbox_mouseover';" onmouseout="javascript: this.className='food_name_textbox';"/> 
     </p> 
     <button id="zoek" type="button" onClick="contentDisp();">Zoek</button> 
    </form> 

和getFood.php：

<?php 
require_once "config.php"; 
$id = "??????" 
$result = mysql_query("SELECT * FROM voedingswaarden WHERE voedsel='$id'"); 
$row = mysql_fetch_array($result); 

echo json_encode($row); 

?> 

Answer 1

$.ajax({ 
    type: 'POST', 
    url: 'getFood.php', 
    data: {'foodnametextbox' : $('#food').val() }, 
    datatype: "json", 
    success: function(data){ 
    $('#table').html(data); 
    } 
}); 

<?php 
require_once "config.php"; 
$id = $_POST['foodnametextbox']; //escape and validate this input before using it in a query 
$result = mysql_query("SELECT * FROM voedingswaarden WHERE voedsel='$id'"); 
$row = mysql_fetch_array($result); 

echo json_encode($row); 

?> 

Answer 2

<script type="text/javascript"> 
function contentDisp() 
{ 
var textSearch = $("#myText").text(); 

$.ajax({ 
    type: 'POST', 
    url: 'getFood.php', 
    data: textSearch, 
    success: function(data){ 
    alert("Data Loaded: " + data); 
    } 

}); 

} 
</script> 

頭

PHP：

$id = $_POST['textSearch'];