无法在PHP中使用Ajax？

I am trying to show a table on a webpage. Table get content from mysql table. I have a delete button in my table in each row. I want that whenever i click on delete button that row should get deleted from database and webpage both.

here is my code

<script>
function ajaxFunction(str){
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
} 
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajax-example.php?name="+str,true);
xmlhttp.send();
}
</script>
<?php
// Connect to the database
 $dbLink = new mysqli('127.0.0.1', 'root', 'root', 'test');
if(mysqli_connect_errno()) {
die("MySQL connection failed: ". mysqli_connect_error());
}

// Query for a list of all existing files
$sql = 'SELECT `id`, `name`, `mime`, `size`, `created` FROM `file`';
$result = $dbLink->query($sql);

// Check if it was successfull
if($result) {
// Make sure there are some files in there
if($result->num_rows == 0) {
    echo '<p>There are no files in the database</p>';
}
else {

    // Print the top of a table
   echo " <table width=100%>
            <tr>
                <td><b>Name</b></td>
                <td><b>Mime</b></td>
                <td><b>Size (bytes)</b></td>
                <td><b>Created</b></td>
                <td><b>&nbsp;</b></td>
            </tr>";

    // Print each file

    while($row = $result->fetch_assoc()){ 

        echo "
            <tr>
                <td>{$row['name']}</td>
                <td>{$row['mime']}</td>
                <td>{$row['size']}</td>
                <td>{$row['created']}</td>
                <td><a href='get_file.php?id={$row['id']}'>Download</a></td>
        <td><input type='checkbox' class='checkbox'></td>
        <td><input type='button' class= 'button' value='delete' name='delete' onClick='ajaxFunction({$row['name']})'></td>
        <td><input type='button' class='button' value='edit' name='edit'></td>
            </tr>";
    }

    // Close table
   echo " </table>";

 }

 // Free the result
 $result->free();
 }
 else
 {
 echo 'Error! SQL query failed:';
 echo "<pre>{$dbLink->error}</pre>";
 }
 echo "<div id='txtHint'>Yours</div>";
 $dbLink->close();
 ?>

here is my ajax-example.php

  <?php
  // Connect to the database
  $name=$_GET['name'];
  $dbLink = new mysqli('127.0.0.1', 'root', 'root', 'test');
  if(mysqli_connect_errno()) {
  die("MySQL connection failed: ". mysqli_connect_error());
   }

  // Query for a list of all existing files

  $sql = 'SELECT `id`, `name`, `mime`, `size`, `created` FROM `file` where `name`="$name"';
  $result = $dbLink->query($sql);

  // Check if it was successfull
  if($result) {
  // Make sure there are some files in there
  if($result->num_rows == 0) {
    echo '<p>There are no files in the database</p>';
  }
  else {
    // Print the top of a table
    echo '<table width="100%">
            <tr>
                <td><b>Name</b></td>
                <td><b>Mime</b></td>
                <td><b>Size (bytes)</b></td>
                <td><b>Created</b></td>
                <td><b>&nbsp;</b></td>
            </tr>';

    // Print each file
    while($row = $result->fetch_assoc()) {

    echo "
            <tr>
                <td>{$row['name']}</td>
                <td>{$row['mime']}</td>
                <td>{$row['size']}</td>
                <td>{$row['created']}</td>
                <td><a href='get_file.php?id={$row['id']}'>Download</a></td>
                <td><input type='checkbox' class='checkbox'><input type='button' style='display:none' class= 'button' value='delete' name='delete'><input type='button' style='display:none' class='button' value='edit' name='edit'></td>
                     </tr>";    
}
    // Close table
    echo "</table>";
    }
    // Free the result
    $result->free();
    }
     else
    {
       echo 'Error! SQL query failed:';
      echo "<pre>{$dbLink->error}</pre>";
     }

     // Close the mysql connection
     $dbLink->close();
     ?>

This file is actually try to print the row in which i click on the delete button. I am trying to do this first. If the row is getting selected then deleting it won't be a problem. But webpage only show table and pressing delete button won't change content "yours". I don't know what to do. Where i am making mistake?

/Note/ This functionality is a part of a feature. Actually those delete button and edit button should be visible when i click on checkbox. For that i use javascript. But here i am not showing it. All i am able to find is that ajaxFunction() is not getting called. Because i try using alert("hi") in it and nothing happen on webpage on clicking on delete button.

Any help?

Thanks

Use the $ajax method using Jquery javascript library.

    $.ajax({
  type: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
})
  .done(function( msg ) {
    alert( "Data Saved: " + msg );
  });

Here you can define data type: type: "POST",, the url of which you want the results and you can pass in data also for your sql query while clause.data: { id: delete_id}

You can study it here. its very easy. http://api.jquery.com/jQuery.ajax/

you store the id in a <input type="hidden"> then have value using $('selector'),val() and assign it to the variable delete_id=$('selector'),val(); selector will be class or id like this: $('#id') or $('.class'). Now pass the data in ajax.

i think i need to move the javascript at head of html.. i ever happen that too... after i move, and that work fine.. hope that can help you..

<html>
<head>
<script>
   <-- your function -->
</script>
</head>
   .
   .

   ,