Получение остальной части строки в базе данных с помощью 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'];