Question

我正在使用ID系统删除。用户输入他/她希望删除的记录的ID，并通过PHP完成。这一切都正常工作，当成功删除时，一个小小的警告框确认了这一点并被带回原始页面，显示记录不再存在。但是，我想以一种不刷新页面并将表格保留在屏幕上的方式使用AJAX。

<head>
<title>ajax_test</title>
<script language="javascript" type="text/javascript" src="prototype.js"></script>
<script>
function updateDIV(myDiv)
{
var url='delete.php';
var params = 'id';
var myAjax = new Ajax.Updater(myDiv, url, {method: 'get', parameters: params});
}
</script>
</head>




<body>
    <form action="delete.php" method="get">
        <input type="text" name="id" placeholder="ID" />
        <input type="submit" value="Delete" onclick="updateDIV(targetDiv)" />
        <div id="targetDiv"></div>
    </form>
</body>

正如您可能看到的，这不起作用。是否有任何明显的问题我应该进一步研究？

Answer 1

将updateDIV函数更改为：

<script type="text/javascript">
function updateDIV(myDiv)
{
   var url='delete.php';
   var id = $F($('id'));
   var myAjax = new Ajax.Updater(myDiv, url, {method: 'get', parameters: 'id='+id});
}
</script>

并为您的输入添加一个id值：

<body>
    <form action="delete.php" method="get">
        <input type="text" id="id" name="id" placeholder="ID" />
        <input type="submit" value="Delete" onclick="updateDIV(targetDiv)" />
        <div id="targetDiv"></div>
    </form>
</body>

$ F是一个原型函数，它获取元素的值。然后在您的PHP代码上，您可以使用$ _GET [＆＃39; id＆＃39;]获取ID。

Answer 2

以下是删除记录的完整源代码而不刷新页面。

按照步骤

<强>步骤1：

DBConnect.php

  class DBConnect
  {
    function DBConnect()
    {
       $link= mysql_connect("localhost","root","")or die("Local Host Error".mysql_error());
       mysql_select_db("test");
    }

    function viewData()
    {
      $query = "SELECT * FROM test_mysql";
      $resultset = mysql_query($query);
      return $resultset;
    }

    function DeleteData($userID)
    {
      $query = "DELETE FROM test_mysql WHERE id=".$userID;
      $resultset=mysql_query($query) ;
    }
  }

<强>步骤2：
 delete.php

   include_once'DBConnect.php';    
   if(isset($_REQUEST['userid']) && $_REQUEST['userid'])    
   {    
     $delObj= new DBConnect();    
     $delObj->DeleteData($_REQUEST['userid']);    
   }

第3步：
 index.php

    <html>
    <head>
    <title></title>
    <script type="text/javascript">
    function deletedata(id)
    {
      var xmlhttp;    
      if (id=="")
        {
            document.getElementById("Display").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)
            {
              window.location.reload()

            }
      }
          xmlhttp.open("GET","delete.php?userid="+id,true);
          xmlhttp.send();

    }
    </script>
    </head>
    <body>
    <?php 
    include 'DBConnect.php';
    $ViewObj= new DBConnect();
    $ResultSet=$ViewObj->viewData();
    ?>
    <span id ="Display">
    <table align="center" border="1" width="50%" cellpadding="4" cellspacing="4">
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>operation</th>
      <th align="center">Action</th>
    </tr>
    <?php
    while($row= mysql_fetch_array($ResultSet))
    {
    ?>
    <tr>
      <td><?php echo $row[0];?></td>
      <td><input type="text" name="txt"></td>
      <td><?php echo $row[1];?></td>
      <td align="center"><a href="#" onClick="deletedata('<?php echo $row[0];?>')" style="color:#00F"><b>Delete</b></a></td>
    </tr>
    <?php
    }
    ?>
    </table>
    </span>
    </body>
    </html>

如果您感觉有任何问题，请告诉我。我们会帮助您。谢谢。

使用AJAX从MySQL数据库中删除值而无需重新加载页面（已编辑）

2 个答案: