使用Ajax從數據庫中顯示數據

我已經在互聯網上或其他問題在這個論壇上學習，但仍然困惑，這個代碼仍然無法正常工作。使用Ajax從數據庫中顯示數據

我嘗試使用onChange通過組合框菜單（1-7）顯示的數據，如果是0將是空

此代碼html & javascript：

<html> 
    <head> 
     <script src="jquery-1.9.1.js"></script> 
    </head> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('#menu').change(function(){ 
      if($(this).val != 0){ 
       var menu_id = $(this).val(); 
       $.ajax({ 
        type:  "GET", 
        url:  "menu.php", 
        menu_id : menu_id, 
        dataType: "html", 
        success: function(response){ 
         $("#data-menu").html(response); 
        } 
       }); 
      } 
     }).change(); 
    )}; 
    </script> 

<body> 
    <table> 
     <tr> 
      <td>Menu</td> 
      <td> 
       <select name="menu" id="menu"> 
        <option value="0" selected='selected'>Select Menu </option> 
        <option value="1">Menu - 1 </option> 
        <option value="2">Menu - 2 </option> 
        <option value="3">Menu - 3 </option> 
        <option value="4">Menu - 4 </option> 
        <option value="5">Menu - 5 </option> 
        <option value="6">Menu - 6 </option> 
        <option value="7">Menu - 7 </option>  
       </select> 
      </td> 
     </tr> 
    </table>  
    <div id="data-menu" align="center"> 
     <!-- Show Data In Here --> 
    </div> 
</body>

而本作menu.php

<?php 
$connection=mysql_connect("localhost","root",""); 
if(!$connection) 
    die('Cant connect !! '. mysql_error()); 

mysql_select_db("BK",$connection); 
$menu_id= $_GET['menu_id']; 

$result=mysql_query("select * from show_product where menu = '" . $menu_id . "' order by show_product_id",$connection); 

$no = 0; // for number 

echo "<table border='1' > 
    <tr> 
     <td>Menu :</td> 
     <td>".$menu_id."</td> 
    </tr> 
    <tr> 
     <td>No</td> 
     <td>Head Text</td> 
     <td>Title Text</td> 
     <td>Max Item</td> 
     <td>Date</td> 
     <td>Status</td> 
    </tr>"; 

while($data = mysql_fetch_row($result)) 
{ 
    echo "<tr>"; 
    $no+=1; 
    echo "<td>".$no."</td>";         //no 
    echo "<td>".$data["head_text"]."</td>";     //head 
    echo "<td>".$data["title_text"]."</td>";     //title 
    echo "<td>".$data["max_item"]."</td>";      //max item 
    echo "<td>".$data["date_added"]."</td>";     //date 
    echo "<td>".'<a href = "Edit_menu.php?id_menu='.$data["show_product_id"].'">EDIT</a>'."</td>"; // EDIT 
    echo "</tr>"; 
} 
echo "</table>"; 
?>

來源

2016-02-17 Vilthering

進行訪問，請參考這個http://stackoverflow.com/questions/9436534/ajax-tutorial-for-post-and-get。這將解決您的問題。在你的代碼中，你正在傳遞'menu_id：menu_id'，而不是在數據中傳遞'menu_id'。 – Apb

要通過ajax發送數據，使用data鍵ajax config和data應持有object

要通過php訪問這些數據，用戶key的object

試試這個：

$(document).ready(function() { 
 
    $('#menu').change(function() { 
 
    if ($(this).val != 0) { 
 
     var menu_id = $(this).val(); 
 
     $.ajax({ 
 
     type: "GET", 
 
     url: "menu.php", 
 
     data: { 
 
      menu_id: menu_id 
 
     }, 
 
     dataType: "html", 
 
     success: function(response) { 
 
      $("#data-menu").html(response); 
 
     } 
 
     }); 
 
    } 
 
    }).change(); 
 
});

menu_id可以作爲$_GET['menu_id']

Fiddle here

來源

2016-02-17 04:57:13 Rayon

已經按照你的指示仍然不工作？ – Vilthering

當我嘗試更改菜單像（1-7），不顯示任何東西？ – Vilthering

使用Ajax從數據庫中顯示數據

回答

相關問題