如何使用ajax顯示數據庫中的數據的html表？

我是一個web開發新手，我真的需要一些help.I想顯示一個html表使用ajax。此代碼來自兩個不同的文件。我在做這個嗎？如何使用ajax顯示數據庫中的數據的html表？

，這裏是我的index.html

<html> 
    <body> 

<script> 
function loadXMLDoc() 
{ 
    var xmlhttp; 
    xmlhttp=new XMLHttpRequest(); 

    xmlhttp.onreadystatechange=function() 
     { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
     document.getElementById("myDiv").innerHTML=xmlhttp.responseText; 
     } 
    } 
    xmlhttp.open("GET","table.php",true); 
    xmlhttp.send(); 
} 
</script> 

     <form action = "insert.php" method="post"> 

     Firstname: <input type="text" name="firstname"></br> 
     Lastname: <input type="text" name="lastname"></br> 
     Middlename: <input type="text" name="middlename"></br> 

     <input type="submit" onclick="loadXMLDoc()"> 


     </form> 
     <div id="myDiv"></div> 

    </body> 
</html>

這裏是我的table.php。當我點擊提交按鈕時，什麼都沒有發生。有沒有人可以告訴我，我是否做得對？

<html> 
    <body> 
     <table border = 1> 
      <tr> 
       <th>FIRSTNAME</th> 
       <th>LASTNAME</th> 
       <th>MIDDLENAME</th> 
       <th>DELETE</th> 
      </tr> 



    /* <?php 
       $con = mysqli_connect("localhost","root","","study"); 

       if (mysqli_connect_errno($con)) 
        { 
         echo "Failed to connect to mysql" . mysqli_connect_error(); 
        } 

        $result = mysqli_query($con,"SELECT * FROM sample_employers"); 

        while($row=mysqli_fetch_array($result)) 
        { 
         echo "<tr>"; 
         echo "<td>" . $row['firstname'] . "</td>"; 
         echo "<td>" . $row['lastname'] . "</td>"; 
         echo "<td>" . $row['middlename'] . "</td>"; 
         echo "<td> <input type='button' value='Delete' </td>"; 
         echo "</tr>"; 
        } 

        mysqli_close($con); 
      ?> 

     </table> 
     </body> 
</html>

來源

2013-07-09 jmjassy27

你可以喜歡使用JSON和jQuery和加載一個臨時頁到HTML DIV – Ghostman

當它工作，你這樣做是正確。否則你沒有。如果你想具體瞭解一些事情，你必須特別提問。 – str

不，看看這個。 http://stackoverflow.com/questions/9436534/ajax-tutorial-for-post-and-get – karmafunk

試試這個代碼table.php

<?php 

$con = mysqli_connect("localhost","root","","study"); 

if (mysqli_connect_errno($con)) 
    { 
     echo "Failed to connect to mysql" . mysqli_connect_error(); 
    } 
     echo '<table border = 1>'; 
     echo '<tr>'; 
      echo ' <th>FIRSTNAME</th>'; 
      echo '<th>LASTNAME</th>'; 
      echo ' <th>MIDDLENAME</th>'; 
      echo ' <th>DELETE</th>'; 
     echo ' </tr>'; 
    $result = mysqli_query($con,"SELECT * FROM sample_employers"); 
    while($row=mysqli_fetch_array($result)) 
    { 
     echo "<tr>"; 
     echo "<td>" . $row['firstname'] . "</td>"; 
     echo "<td>" . $row['lastname'] . "</td>"; 
     echo "<td>" . $row['middlename'] . "</td>"; 
     echo "<td> <input type='button' value='Delete' </td>"; 
     echo "</tr>"; 
    } 
    mysqli_close($con); 
    echo '</table>'; 
?>

來源

2013-07-09 09:19:43

非常感謝你.. – jmjassy27

有一些所謂的客戶端腳本（通過JavaScript）和（在部份情況下用PHP）服務器端語言

你可以有一個AJAX調用將調用你的table.php並將得到響應。

所以你必須在index.html中做他的代碼ajax方法。

像你上面
編碼通過AJAX的jQuery的參考http://www.w3schools.com/jquery/ajax_post.asp(tutorial)

jQuery是Javascript的一種廣泛使用的圖書館，你一定會發現它很有趣。

所以我建議有兩個單獨的文件

的index.html，將有AJAX方法來調用table.php
table.php將要執行的Ajax調用和返回它想要的結果

然後由您決定如何顯示結果。

來源

2013-07-09 09:24:26

謝謝....這將有助於 – jmjassy27

首先直接在瀏覽器中打開ajax頁面，這是找出您將獲得的ajax響應的最佳方法。其次，更新您的Ajax代碼爲：

$(function(){ 
    $.ajax({ 
     url  : 'table.php', 
     data : {}, 
     type : 'GET', 
     success : function(resp){ 
      $("#myDiv").html(resp); 
     }, 
     error : function(resp){ 
      //alert(JSON.stringify(resp)); open it to alert the error if you want 
     } 
    }); 
});

來源

2013-07-09 10:43:02

如何使用ajax顯示數據庫中的數據的html表？

回答

相關問題