Question

我的PHP脚本生成一个包含行的表，可以选择对其进行编辑或删除。还可以创建一个新的Row。 PHP通过jQuery Events激活。

现在一切正常，我可以编辑删除并创建一个项目。在每个使用PHP脚本的操作之后，HTML表都会更新。

但是，当我尝试事件再次执行操作时，HTML表格不会更新，尽管在后台PHP脚本会进入数据库。

当我触发第二个事件时，有人知道为什么我的HTML表格不会自动更新吗？

这是脚本：

PHP

<?php
  require_once "../../includes/constants.php";
  // Connect to the database as necessary
  $dbh = mysql_connect(DB_SERVER,DB_USER,DB_PASSWORD)
    or die ("Unaable to connnect to MySQL");

  $selected = mysql_select_db(DB_NAME,$dbh)
    or die("Could not select printerweb");

   $action = $_POST['action'];
   $name = $_POST['name'];
   $id = $_POST['id'];

    if($action == "new")
      {
        mysql_query("INSERT INTO `place` (`id`, `name`) VALUES (NULL, '$name')");
      }
    elseif($action == "edit")
      {
        mysql_query("UPDATE `place` SET `name` = '$name' WHERE `id` = '$id'");        
      }
    elseif($action == "delete")
      {
        mysql_query("DELETE FROM place WHERE id = '$id'");
      }

    echo "<table><tbody>";
    $result = mysql_query("SELECT * FROM place");
    while ($row = mysql_fetch_array($result)) {
      echo "<tr><td id=".$row["id"]." class=inputfield_td><input class=inputfield_place type=text value=".$row["name"]." /></td><td class=place_name>".$row["name"]."</td><td class=edit>edit</td><td class=cancel>cancel</td><td class=delete>delete</td><td class=save>SAVE</td></tr> \n";
    }
    echo "</tbody>";
    echo "</table>";
    echo "<input type=text class=inputfield_visible />";
    echo "<button class=new>Neu</button>";
?>

JS

$(function() {
  $.ajax({
  url: "place/place_list.php",
  cache: false,
  success: function (html){
    $("#place_container").append(html);
      }
  });
  $(".edit").live("click", function() {
    $(this).css("display","none").prevAll(".place_name").css("display","none").prevAll(".inputfield_td").css("display","block").nextAll(".cancel").css("display","block").nextAll(".save").css("display","block").prevAll(".inputfield_td").css("display","block");
  });
  $(".cancel").live("click", function() {
    myvariable5 = $(this).prevAll(".place_name").html();
    $(this).css("display","none").prevAll(".edit").css("display","block").prevAll(".place_name").css("display","block").prevAll(".inputfield_td").css("display","none").nextAll(".save").css("display","none").siblings().find("input[type=text]").val(myvariable5);
  });
  $(".save").live("click", function() {
    var myvariable1 = $(this).siblings().find("input[type=text]").val();
    var myvariable2 = $(this).prevAll("td:last").attr("id");
    $(this).css("display","none").prevAll(".cancel").css("display","none").prevAll(".edit").css("display","block").prevAll(".place_name").css("display","block").prevAll(".inputfield_td").css("display","none");
    $.post("place/place_list.php", {action: "edit", name: ""+myvariable1+"", id: ""+myvariable2+""}, function (html){$("#place_container").replaceWith(html);});
  });
  $(".delete").live("click", function() {
    var myvariable3 = $(this).prevAll("td:last").attr("id");
    $.post("place/place_list.php", {action: "delete", id: ""+myvariable3+""}, function (html){$("#place_container").replaceWith(html);});
  });
  $(".new").live("click", function() {
    var myvariable4 = $(this).prevAll("input[type=text]").val();
    $.post("place/place_list.php", {action: "new", name: ""+myvariable4+""}, function (html){$("#place_container").replaceWith(html);});
  });
});

Answer 1

你不能更换完整的桌子吗？

$("#place_container").html(html);

Answer 2

我想我知道。您执行 replaceWith 而不是追加，因此您的ID #place_container的DIV在第一次操作后消失（您的页面中只剩下一个表），并且当然jQuery没有找到它，也无法用第二个操作中的新内容刷新它。

只需使用追加或更好的html方法。

表不响应第二个jQuery请求

2 个答案: