为什么我的动态删除不起作用?

时间:2013-12-09 02:51:34

标签: php jquery mysql ajax

插入和动态表创建工作正常。通过按下该行上的按钮,一切都可以动态地从数据库中删除记录。尝试了几种不同的方法来访问该值而没有结果。按钮只是单击而没有任何反应。任何帮助将不胜感激! (所有四个部分的代码如下。)

主页:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP Test</title>
<link href="styleTest.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="container">
<header id="header"><strong>PHP Test</strong></header>
<div id="mainContent" align="center">
<form id="myForm" action="insert.php" method="post">
<table>
    <tr valign="baseline">
        <td>Name:</td>
        <td> <input id="name" type="text" name="name"/></td>
    </tr>
    <tr valign="baseline">
    <td>Comment:</td>
        <td> <input id="comment" type="text" name="comment"/></td>
    </tr>
    <tr valign="baseline">
        <td><input name="sub" id="sub" type="button" value="Save"></td>
    </tr>
</table>
</form>
<span id="result"></span>
</div><!-- mainContent -->
</div><!-- Container -->
<script src="jquery-1.8.1.min.js" type="text/javascript"></script>
<script src="my_script.js" type="text/javascript"></script>
</body>
</html>

插入页面:

<?php
//get the values passed by post
$name = mysql_real_escape_string($_POST['name']);
$comment = mysql_real_escape_string($_POST['comment']);

//create connection to Database
$hostname = "localhost";
$database = "test";
$username = "root";
$password = "";
$con = mysqli_connect($hostname, $username, $password) or trigger_error(mysql_error(),E_USER_ERROR);
mysqli_select_db($con,$database);

//Run the insert query and check to see if it processes
if(mysqli_query($con,"INSERT INTO info VALUES('','$name', '$comment')"))
{
  echo "Successfully Inserted";
  $sql2="SELECT * FROM info ORDER BY ID ASC";
  $result = mysqli_query($con,$sql2);
  echo "<table border='1'>
  <tr>
  <th>Name</th>
  <th>Comment</th>
  <th>Remove Entry</th>
  </tr>";

  while($row = mysqli_fetch_array($result))
  {
    echo "<tr>";
    echo "<td>" . $row['NAME'] . "</td>";
    echo "<td>" . $row['COMMENTS'] . "</td>";
    echo "<td> <form id='myForm2' method='post' action='delete.php'><input name='del' id='del'
     type='button' value='Delete'><input id='id' type='hidden' name='id' value=".$row['ID']."></form></td>";
    echo "</tr>";
  }
  echo "</table>";
}
else
  echo "Save Failed!";
//close connection to database
mysqli_close($con);
?>

删除页面:

<?php
//create connection to Database
$hostname = "localhost";
$database = "test";
$username = "root";
$password = "";
$con = mysqli_connect($hostname, $username, $password) or trigger_error(mysql_error(),E_USER_ERROR);
mysqli_select_db($con,$database);
//retrieve posted variables
$id= mysql_real_escape_string($_POST['id']);

$sql="DELETE FROM info WHERE ID = $id";
$query = mysql_query($con,$sql);
if(mysql_affected_rows()>0){ 
$sql2="SELECT * FROM info ORDER BY ID ASC";
  $result = mysqli_query($con,$sql2);
  echo "<table border='1'>
  <tr>
  <th>Name</th>
  <th>Comment</th>
  <th>Remove Entry</th>
  </tr>";

  while($row = mysqli_fetch_array($result))
  {
    echo "<tr>";
    echo "<td>" . $row['NAME'] . "</td>";
    echo "<td>" . $row['COMMENTS'] . "</td>";
    echo "<td> <form id='myForm2 method='post' action='delete.php'><input name='del' id='del' type='button' value='Delete'><input id='id' type='hidden' name='id' value=".$row['ID']."></form></td>";
    echo "</tr>";
  }
  echo "</table>";
}else{
echo "Error deleting Data";
}
mysqli_close($con);
?>

脚本:

$(document).ready(function()
{
  $("#sub").click( function()
   {
        //Check to see that no fields are left blank if one is all fields are cleared and save is failed from insert.php.
        if ($("#name").val()=="")
        {
            clearInput();
            return false;
        }
        else if($("#comment").val()=="")
        {
            clearInput();
            return false;
        }
        //save the fields into an array and post to the result span then clear inputs   
        $.post( $("#myForm").attr("action"), 
        $("#myForm :input").serializeArray(), 
        function(info){ $("#result").html(info);});
        clearInput();  
  });

  $('#del').click(function()
  {
       $.post( "delete.php",$("#myForm2 :input").serialize(),function(info){ $("#result").html(info);});
  });
});

$("#myForm").submit( function() {
  return false; 
});

1 个答案:

答案 0 :(得分:2)

您有多个具有相同ID del的元素,因为输入是在循环中创建的 - 当您使用id选择器时,它将仅返回具有给定ID的第一个元素,因此您的click处理程序将被注册只到第一个元素。您可以使用class属性对相似的元素进行分组,而不是id。

<input name='del' id='del' type='button' value='Delete'>更改为

<input name='del' class='del' type='button' value='Delete'>

然后使用类选择器来注册处理程序。

$('#del').click(function () {
    $.post("delete.php", $("#myForm2 :input").serialize(), function (info) {
        $("#result").html(info);
    });
});